百度Ueditor编辑器wordimage踩坑

背景

改造公司老项目后台编辑器，使用百度的Ueditor做替换。

发现问题

1、ue编辑器初始化后部分参数无法覆盖ueditor.config.js中的选项。
2、wordimage（word图片转存）始终是灰色，无法使用。

解决办法

1、将ueditor.config.js中的inputXssFilter设置为false
2、将ueditor.all.js源码中添加input过滤规则的地方添加上下面的代码：

if (whitList && config.inputXssFilter) {
...if (node.type !== 'element') {return false;}// 添加内容开始if (node.tagName === 'img' && node.attrs.word_img) {return false;}// 添加内容结束filter(node);
...
}
复制代码

推荐使用第二种方法解决

寻踪

首先打开ueditor.all.js搜索“wordimage”找到本地图片引导上传

UE.plugin.register('wordimage',function(){
...
复制代码

在 inputRule 方法中使用 debugger 打断点调试，发现在这里img的attrs变了

紧接着搜索"!== 'element'"很快就找到了：

发现如果是element元素就进行filter过滤，意识到了我可以通过关闭inputXssFilter来关闭这个过滤。

但是这个输入的Xss过滤我感觉还是不要去掉的好。所以就依据word_img的这个attr属性添加了对应的判断。

使之可以跳过这个filter。

结语

至此就解决了ueditor的wordimage图片转存不生效的问题了。

至于在实例化UE的时候，传入 inputXssFilter: false 不生效的问题还木有去查，懒得查了，毕竟改了源码后不影响使用。

还是希望开发者们在写过滤规则的时候，要考虑全局，是否会有一些特定的规则处理。

大橘为重嘛！！！

表情包如有侵权，请联系作者删除

转载于:https://juejin.im/post/5d00ab3e518825183b454cf7

百度Ueditor编辑器wordimage踩坑相关推荐

百度UEditor编辑器关闭抓取远程图片功能（默认开启）
2019独角兽企业重金招聘Python工程师标准>>> 这个坑娘的功能,开始时居然不知道如何触发,以为有个按钮,点击一下触发,翻阅了文档,没有发现,然后再网络上看到原来是复制粘贴非白 ...
百度UEditor编辑器上手体验
原先一个项目使用的是kindEidtor编辑器,客户反馈有问题,要求修改,因此查阅资料后,决定改用百度UEditor编辑器. 因为要提交到后台更新到数据库,所以前端使用隐藏的textArea保存临时数 ...
ueditor html显示图片,百度ueditor编辑器上传图片后img标签的title、alt属性优化简单方法...
<百度ueditor编辑器上传图片后img标签的title.alt属性优化简单方法>要点: 本文介绍了百度ueditor编辑器上传图片后img标签的title.alt属性优化简单方法,希望 ...
html编辑器 br 被div,百度Ueditor编辑器DIV,html标签替换及代码被过滤问题解决方法...
解决"织梦DEDECMS使用百度Ueditor编辑器和代码高亮设置教程"中遗留的html标签过滤问题.前者资源盒子主要描述了如何在织梦CMS中使用百度Ueditor编辑器,但遗留了 ...
织梦html编辑器功能在哪,织梦dede自带编辑器替换百度ueditor编辑器
用过dedecms的朋友都知道dede自带的文本编辑器很不好用,且有些功能还需要我们自己手动去修改源码,才能完成我们想要的效果.现在广大用dedecms的朋友们,你们有福啦!我们可以利用百度的Uedi ...
百度ueditor编辑器注入漏洞修补查杀程序
百度ueditor编辑器注入查杀程序,用于对百度ueditor的漏洞补丁进行查杀,使用时需要保证本地正确部署了.net 4.0服务. 百度ueditor编辑器是目前网上比较流行的一个网站编辑器,但由于 ...
[转]百度UEditor编辑器(php)
百度UEditor编辑器!合入PHP网站! 一.富文本内容交互 1.编辑器内容初始化(即往编辑器中设置富文本) 场景一:写新文章,编辑器中预置提示.问候等内容. 在editor_config.js文件 ...
百度UEditor编辑器,合入PHP网站
本文转自:http://www.cnblogs.com/losen/archive/2013/05/23/3094612.html 百度UEditor编辑器!合入PHP网站! Posted on 20 ...
关于dedecms织梦后台html编辑器不能复制word格式的处理方法/ kindEditor编辑器/百度(ueditor)编辑器的添加方法
Q:word文件内容粘贴到dede后台编辑器里,格式都失效了 dede自带的文本编辑器很不好用,且有些功能还需要我们自己手动去修改源码,才能完成我们想要的效果一.更换kindEditor编辑器操作步 ...

百度Ueditor编辑器wordimage踩坑

背景

发现问题

解决办法

寻踪

结语

百度Ueditor编辑器wordimage踩坑相关推荐

最新文章

热门文章