温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

html5编辑器本地保存图片不显示怎么解决

发布时间:2022-03-03 15:25:34 来源:亿速云 阅读:340 作者:iii 栏目:web开发

这篇文章主要介绍“html5编辑器本地保存图片不显示怎么解决”,在日常操作中,相信很多人在html5编辑器本地保存图片不显示怎么解决问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”html5编辑器本地保存图片不显示怎么解决”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!

  用Eclipse开发WEB项目的时候,使用到了Ueditor上传图片的功能,插件会自动将上传的图片保存在Eclipse工作目录下,这种保存的方式非常不利于后续对图片的操作(管理),这时我们就要修改Ueditor的源码,解决上传图片时的路径问题。

  1、下载ueditor源码并引用到工程

  将jsp/src/目录下的所有文件拷贝到你的工程下

  目录视图

  将ueditor-1.1.2.jar删除,只引用前四个jar包

  2、修改Tomcat服务器配置,添加图片映射路径

  在tomcat中添加图片的绝对路径和图片访问虚拟路径

  修改config.json配置文件,访问路径填写刚配置的虚拟目录

  3、创建配置文件(可省略)

  在src目录下创建config.properties ,存放图片路径

  读配置文件的目的是为了动态修改保存路径,可以更方便的管理图片

  创建ConfigUtil.java类,用于读取配置文件

  import java.io.IOException;

  import java.io.InputStream;

  import java.io.InputStreamReader;

  import java.util.Properties;

  public class ConfigUtil {

  private static Properties pro;

  static{

  pro=new Properties();

  //默认从类的所在包目录开始查找资源文件

  //如果要classpath的根目录开始找,必须加上/

  //默认从classspath的根目录开始查找资源文件

  InputStream input=ConfigUtil.class

  .getClassLoader()

  .getResourceAsStream("config.properties");

  try {

  pro.load(new InputStreamReader(input,

  "UTF-8"));

  } catch (IOException e) {

  e.printStackTrace();

  }finally{

  if(input!=null){

  try {

  input.close();

  } catch (IOException e) {

  e.printStackTrace();

  }

  }

  }

  }

  public static String get(String key){

  return pro.getProperty(key);

  }

  public static int getInt(String key){

  return Integer.parseInt(pro.getProperty(key));

  }

  }

  4、修改源码(修改图片保存路径)

  选中项目,使用Eclipse文件搜索功能

  搜索 physicalPath

  找到在3个类中使用到了 physicalPath

  这里有3个类的是要修改源码的

  //注释掉原来的路径代码

  //String physicalPath = this.rootPath + savePath;

  使用自定义的路径(这个路径是通过配置文件读取的,相当于取代源码中的this.savePath)

  注意:ConfigUtil.get("savepath") ,字段名必须一样,否则读取不了

  ImageHunter.java

  Base64Uploader.java

  BinaryUploader.java

  5、测试:

  往编辑器添加一张图片

  再来看看图片保存目录

  通过改源码的方式就能成功对图片进行统一管理了。

  6、在strtus中使用Ueditor编辑器需要注意

  如果配置文件中配置了过滤所有的请求,需要将其设置成只过滤.action的请求,否则导致文件保存不成功的情况。

到此,关于“html5编辑器本地保存图片不显示怎么解决”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注亿速云网站,小编会继续努力为大家带来更多实用的文章!

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI