UEditor图片上传至服务器

1 去UEditor官网下载需要的版本(https://ueditor.baidu.com/website/download.html);

2 关于图片上传大体需要4个步骤;

2.1 修改ueditor.config.js配置文件,主要是修改后台请求地址;

 window.UEDITOR_CONFIG = {

        //为编辑器实例添加一个路径,这个不能被注释
        UEDITOR_HOME_URL: URL
		,imageUrl:URL+"jsp?imageUp.jsp"
		,imagePath:URL+"jsp"
        // 服务器统一请求接口路径,根据你后端存放的具体位置设置
        , serverUrl: "http://localhost:8181/bpeClean/plug-in/ueditor/jsp/controller.jsp"

2.2 修改后台配置文件config.json

这里的controller.jsp即是刚才请求的处理接口;lib文件夹下是依赖的jar包;

config文件主要修改两个参数;

2.2.1 修改文件的相对路径:imagePathFormat

2.2.2 修改访问文件的前缀:imageUrlPrefix;

所以图片的实际访问地址是:imageUrlPrefix+imagePathFormat;

2.3 修改后台接口controller.jsp

这里是根据ueditor 自己默认的处理方式,当然也可以修改成自己需要的逻辑;还有一点就是,此处的方法可能根据jar包版本不同,参数略有不同,需根据实际情况调整;其中rootPath是当前项目的绝对地址。

默认上传的图片会放在这个位置(如果修改了imagePathFormat参数,这里就是imagePathFormat的修改后的位置):

2.4 前端页面也是需要稍微修改一下的;

上传文件的按钮;

2.5 当然也支持直接复制文件到编辑框进行粘贴操作;

上传图片实际请求的的后台接口:

2.6 有一点需要注意的是,如果是项目是前后端分离的话,需要考虑跨域的情况;

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值