ueditor百度编辑器上传PDF并显示

百度编辑器不止可以上传图片和文字，还可以上传文件，但是文件是当成附件来显示的，并不可以直接显示文件的内容，就像下面：

附件显示

这样子来说，对于PDF的文件支持性就不是很好了，所以，可以稍微改造一下，让其可以直接显示我们上传的PDF文档的内容

首先，得解决上传文件的问题，附件的上传按钮如下图：

附件按钮

点击以后，可以上传文件，也可以在已上传的文件中选择：

上传文件

已上传的文件

假如没有这个按钮，则可以去看看是否生成编辑器的时候隐藏了此工具，如果是直接实例化的编辑器，可以在 ueditor 下的 ueditor.config.js 文件里找一下下图，看看是否有此工具：attachment

ueditor.config.js

同样的，假如是在配置ueditor的时候写过工具栏，可以看看是否有在工具栏里加了这个，这个就不贴图了。

默认来说，附件的上传都会允许PDF的文件格式，但假如不支持，打开 ueditor/php/config.json  进行配置的修改添加

config.json

上传图片和文件的功能我就不在这里重复了，网上都有，或者看看我之前上传的文档 tp5插入百度富文本编辑器UEditor

接下来是重点，修改 ueditor.all.js 文件，重新编写上传PDF文档后的html，搜索：插入附件

ueditor.all.js

并修改代码：

if(title.indexOf("pdf")>0){

    html +='';

}else{

    html += '

' + '' + '' + title + '' + '

';

}

ueditor.all.js

这样还不行，ueditor编辑器是会屏蔽 iframe 标签的，所以，我们得把 iframe 标签加入白名单，白名单的操作也在 ueditor.config.js 里

ueditor.config.js

添加这行代码，，[ ]里是 iframe 标签的属性值，你可以看着修改

iframe: ['src', 'width', 'height', 'style'],

一切都修改好了以后，别忘了保存并清除浏览器的缓存，接着，就是见证奇迹的时刻！！

PDF

资料参考自：http://quanzhan.applemei.com/webStack/TWpBME9RPT0=

ueditor富文本上传pdf并能实时预览

以上。