资讯专栏INFORMATION COLUMN

百度UEditor自定义上传地址

missonce / 1703人阅读

摘要:之前有个小朋友问我百度怎么自定义服务端上传地址正好也用过,现在做下笔记吧。上传结果返回格式是这样的失败的情况成功的情况图片源文件名图片后缀图片大小图片标签上的属性图片上传之后的好了就这样原为连接百度自定义上传地址更多知识分享请扫码关注

之前有个小朋友问我百度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自定义上传地址

更多知识分享,请扫码关注:

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/31650.html

相关文章

  • 百度UEditor定义上传地址

    摘要:之前有个小朋友问我百度怎么自定义服务端上传地址正好也用过,现在做下笔记吧。上传结果返回格式是这样的失败的情况成功的情况图片源文件名图片后缀图片大小图片标签上的属性图片上传之后的好了就这样原为连接百度自定义上传地址更多知识分享请扫码关注 之前有个小朋友问我百度UEditor怎么自定义服务端上传地址, 正好也用过,现在做下笔记吧。 在ue实例化的时候你服务端上传的请求地址赋值给server...

    lavor 评论0 收藏0
  • yii2-Ueditor百度编辑器

    摘要:今天在网上看了下有关图片上传的教程,历经挫折才调试好,现在把相关代码及其说明贴出来,以供初次使用的朋友们参考。 今天在网上看了下有关图片上传的教程,历经挫折才调试好,现在把相关代码及其说明贴出来,以供初次使用的朋友们参考。 资源下载 yii2.0-ueditor下载路径: https://link.jianshu.com?t=https://github.com/org-yii-chi...

    fuchenxuan 评论0 收藏0
  • 为Flask编写1个百度编辑器的插件

    原文地址: http://52sox.com/write-a-flask-plugin-for-ueditor/ 近期项目开发中,隔壁那个搞python的哥们竟然笑着对我说,希望我能给他写1个百度编辑器的demo,方便他直接调用。 当时真的受宠若惊,这哥们实力不在我之下,只能答应它了。上网搜索下,有1篇文章Flask项目集成富文本编辑器UEditor实现图片上传功能已经有1个现成的例子了。 这...

    xbynet 评论0 收藏0
  • 为Flask编写1个百度编辑器的插件

    原文地址: http://52sox.com/write-a-flask-plugin-for-ueditor/ 近期项目开发中,隔壁那个搞python的哥们竟然笑着对我说,希望我能给他写1个百度编辑器的demo,方便他直接调用。 当时真的受宠若惊,这哥们实力不在我之下,只能答应它了。上网搜索下,有1篇文章Flask项目集成富文本编辑器UEditor实现图片上传功能已经有1个现成的例子了。 这...

    wqj97 评论0 收藏0
  • React中使用UEditor

    摘要:前言本文将介绍笔者在的项目中使用百度的富文本编辑器的过程。以百度官网的为例,控制台输入为该编辑器注册点击事件,当点击加粗按钮时,控制台输出为了避免点击工具条时触发事件,笔者将自定义的事件全部注释了。 前言 本文将介绍笔者在React的项目中使用百度的富文本编辑器Ueditor的过程。注意本文不提供一条龙式的使用方法,只是将使用过程中的一些实现思路进行总结,供以参考。react项目中导入...

    firim 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<