内容简介:之前有个小朋友问我百度UEditor怎么自定义服务端上传地址, 正好也用过,现在做下笔记吧。在ue实例化的时候你服务端上传的请求地址赋值给serverUrl在上面自定义了服务端地址之后,我们刷新页面,ue实例化的时候会自动请求你的地址并且带着query参数,大概是这样:
之前有个小朋友问我百度UEditor怎么自定义服务端上传地址, 正好也用过,现在做下笔记吧。
在ue实例化的时候你服务端上传的请求地址赋值给serverUrl
var ue;
ue = UE.getEditor('editor', {
toolbars: [ //这个是 工具 栏配置,自己定义和今天主题无关
[
'fullscreen', 'source', '|', 'undo', 'redo', '|',
'bold', 'italic', 'underline', 'fontborder', 'strikethrough', 'superscript',
'subscript', 'removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|',
'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc', '|',
'rowspacingtop', 'rowspacingbottom', 'lineheight', '|',
'customstyle', 'paragraph', 'fontfamily', 'fontsize', '|',
'directionalityltr', 'directionalityrtl', 'indent', '|',
'justifyleft', 'justifycenter', 'justifyright', 'justifyjustify', '|', 'touppercase', 'tolowercase', '|',
'link', 'unlink', 'anchor', '|', 'imagenone', 'imageleft', 'imageright', 'imagecenter', '|',
'simpleupload', '|', 'pagebreak', 'template', 'background', '|',
'horizontal', 'date', 'time', 'spechars', 'snapscreen', 'wordimage', '|',
'inserttable', 'deletetable', 'insertparagraphbeforetable', 'insertrow', 'deleterow', 'insertcol',
'deletecol', 'mergecells', 'mergeright', 'mergedown', 'splittocells', 'splittorows',
'splittocols', 'charts', '|',
'preview'
]
],
serverUrl: 'http://your-server-address' //这里是你服务端上传的请求地址
});
在上面自定义了服务端地址之后,我们刷新页面,ue实例化的时候会自动请求你的地址并且带着query参数,大概是这样: http://your-server-address?ac... 。这是ue实例化会请求配置文件,简单点你可以直接返回ue插件文件夹中ueditor/1.4.3.3/php/config.json的内容就可以了。当然了具体配置你是可以自己按自己需求改动。
接下来上传图片,随便上传一张图片,会发现ue的请求地址是 http://your-server-address?ac... 。这样是不是恍然大悟:
action参数是config,你就给他返回配置内容; action参数是uploadimage就是图片上传,你就保存图片文件,返回成功或者失败的结果。
上传结果返回格式是这样的:
失败的情况
{
"state": "Failed",
"msg": "error msg"
}
成功的情况:
{
"state": "SUCCESS", "msg": "ok", "original": "aaa.jpg", //图片源文件名 "type": ".jpg", //图片后缀 "size": 10240000, //图片大小 "title": "aaa", //图片img标签上的属性title "url": "/upload/fsf3r.jpg" //图片上传之后的url
}
好了就这样
原为连接:
百度ueditor自定义上传地址更多知识分享,请扫码关注:
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网
猜你喜欢:- Vue + Element + vue-quill-editor 实现源码编辑、自定义图片上传和汉化
- axios上传图片,koa2接收保存上传的图片,lrz在上传前压缩图片
- 前端实现axios以表单方式上传文件,优化上传速度
- JeeSite V4.1.4 发布,支持分片上传、多线程上传
- SpringMVC教程--图片上传
- 文件上传限制绕过
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
HTML 5实战
陶国荣 / 机械工业出版社 / 2011-11 / 59.00元
陶国荣编著的《HTML5实战》是一本系统而全面的HTML 5教程,根据HTML 5标准的最新草案,系统地对HTML 5的所有重要知识点进行了全面的讲解。在写作方式上,本书以一种开创性的方式使理论与实践达到极好的平衡,不仅对理论知识进行了清晰而透彻的阐述,而且根据读者理解这些知识的需要,精心设计了106个完整(每个案例分为功能描述、实现代码、效果展示和代码分析4个部分)的实战案例,旨在帮助读者通过实......一起来看看 《HTML 5实战》 这本书的介绍吧!