随笔 - 1357  文章 - 0  评论 - 1104  阅读 - 1941万

UEditor编辑器上传图片开发流程

在ueditor目录下找到uedior.config.js,找到如下三行:

,imageUrl: "<%=path %>/controller.json" //图片上传提交后台对应的地址,路径固定为*/controller.*
,imagePath: "<%=path %>/ueditor/" //图片在服务器上的存储目录
,imageFieldName: "upload" //后台对应接收image的参数名

或者:

var ueditor = UE.getEditor('myEditor',{
    imageUrl: "<%=path %>/servlet/UploadServlet", //图片上传提交后台对应的地址
    imagePath: "<%=path %>/ueditor/",  //图片在服务器上的存储目录
    imageFieldName: "upload"  //后台对应接收image的参数名
});

注意:记得在uedior.config.js配置文件中把"serverUrl"注释掉

在/ueditor/_src/plugins/simpleupload.js文件中,把link = me.options.imageUrlPrefix + json.url; 改为link = getRootPath()+json.url;

最后配置服务器返回的数据格式,这需要这服务器端进行修改。对应于后台接收上传图片的那个controller,返回的格式需如下:

{'url':'60391393848223.jpg','title':'p1999637039.jpg','original':'p1999637039.jpg','state':'SUCCESS'}

注意:url用相对路径,这样就OK了。

复制代码
//js获取项目根路径,如: http://localhost:8083/uimcardprj

function getRootPath(){

    //获取当前网址,如: http://localhost:8083/uimcardprj/share/meun.jsp

    var curWwwPath=window.document.location.href;

    //获取主机地址之后的目录,如: uimcardprj/share/meun.jsp

    var pathName=window.document.location.pathname;

    var pos=curWwwPath.indexOf(pathName);

    //获取主机地址,如: http://localhost:8083

    var localhostPaht=curWwwPath.substring(0,pos);

    //获取带"/"的项目名,如:/uimcardprj

    var projectName=pathName.substring(0,pathName.substr(1).indexOf('/')+1);

    //return localhostPaht + projectName;

    return localhostPaht+"/";

}
复制代码

 

posted on   Ruthless  阅读(24927)  评论(0编辑  收藏  举报
编辑推荐:
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
阅读排行:
· winform 绘制太阳,地球,月球 运作规律
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· 写一个简单的SQL生成工具
· AI 智能体引爆开源社区「GitHub 热点速览」
< 2025年3月 >
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5

点击右上角即可分享
微信分享提示