TinyMCE 4图像工具不适用于远程存储的图像

时间:2015-09-16 03:09:50

标签: javascript tinymce tinymce-4 rich-text-editor

TinyMCE有plugin名为imagetools。这之前有用,但由于某种原因,现在上下文内联菜单不再出现了,我想把它拿回来。

这是我的初始化参数

schema: 'html5',
inline: false,
toolbar: 'bold italic underscore image',
menubar: true,
plugins: [
            "advlist autolink lists link hr anchor pagebreak",
            "searchreplace wordcount visualblocks visualchars code fullscreen",
            "insertdatetime nonbreaking table contextmenu directionality",
            "template paste textcolor colorpicker textpattern imagetools autoresize"
         ],
paste_data_images: false,
browser_spellcheck : true,
image_advtab: true,
toolbar1: "undo redo | styleselect | bold italic | preview | forecolor backcolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link",
tools: "inserttable image fullscreen",
responsive: true,
paste_retain_style_properties: "all",
relative_urls: false,
remove_script_host : false,
convert_urls : true

即使删除了这些设置并使用官方全功能演示页面中的默认值,它仍然无效。

更新

我和许多其他人上传图片的方式是上传到服务器,然后服务器返回某种目录或URL,然后传回新上传图片的src属性,即然后显示在编辑器中。换句话说,图像不是作为BLOB或Base64存储在实际编辑器中,而是作为外部资源的链接。

在TinyMCE官方论坛上阅读更多内容之后,this thread上的一篇帖子说:

  

除非配置了CORS或代理,否则只有本地服务器映像才会显示imagetools内联工具栏。

鉴于我的实现中的图像没有在Base64中本地存储在编辑器中,它可能解释了为什么高级工具栏没有出现 - 它不能对远程存储的图像进行编辑,除了可能的使用CSS,可以在加载后添加到图像中....我认为它可以工作,但看起来并非如此。

此时我更感兴趣的是如何获得“CORS或Proxy配置”以使这种高级编辑成为可能。 question与我的有点相关。

更新2

我的应用程序是一个HTTPS webapp,但我在编辑器中通过HTTP加载外部图像,这在控制台中发出警告。删除该图像后,只有HTTPS图像,高级菜单再次出现!现在的问题是,由于它是一个外部图像,在编辑器中对图像进行编辑会导致它被存储为blob,所以很明显我需要调用一些可以将图像重新上传到服务器的函数。有没有人这样做过?

以下是一些可以用来启动的资源:

1 个答案:

答案 0 :(得分:0)

要回答我最初提出的问题,就是这样:

我的应用程序是一个HTTPS webapp,但我在编辑器中通过HTTP加载外部图像,这在控制台中发出警告。删除该图像后,只有HTTPS图像,高级菜单再次出现!这一点很重要,尤其是对于那些可能想知道为什么他们无法编辑他们从其他网页粘贴的图片的用户。

总而言之,我想出来了,但我不确定它的真正解决方案是什么。