TinyMCE拖放图片上传问题

我已经使用了TinyMCE一段时间，但现在想要实现拖放图片上传功能。（例如，您可以从本地计算机拖动图像到文本编辑器中，调整其重新定位等等，然后将其上传到服务器）我将为此功能购买Redactor，但后来我注意到TinyMCE的paste_data_images选项允许图像被直接拖入/粘贴到编辑器中。这似乎将其转换为内联base64编码数据。TinyMCE拖放图片上传问题

我怀疑并已经读过，理论上可能会将此值提交给服务器，从Dom中提取base64 uris，将它们写入文件，将SRC替换为新创建的路径文件，然后将文本提交到数据库。有没有人做到这一点？

从我最初的探索，我发现问题可能是：

巨大的图像（〜100MB）可能被粘贴到这可能会导致问题的文本框中。
Internet Explorer 11和Edge浏览器都不是似乎允许拖放图像到文本框中。

有没有人设法让这项工作看起来不错？

我已经重新检查了Redactor并注意到它也无法与IE和Edge一起使用。

来源

2016-04-26 Manachi

TinyMCE的4.2+实际上有它自己的内置工艺处理，你在编辑器中放置图片的上传：

https://www.tinymce.com/docs/advanced/handle-async-image-uploads/

的基本过程是，TinyMCE的会为每个单独的HTTP POST您插入编辑器的图像。它会根据init中images_upload_url选项的设置将该图像发送到您选择的URL（通过HTTP POST）。

images_upload_url（您必须创建）中引用的URL处的图像处理程序必须执行任何需要将图像“存储”到应用程序中的操作。这可能意味着是这样的：一个文件夹中

存储项Web服务器
存储该项目上的数据库中
存放在资产管理系统

的项目.. 。无论您选择存储图像的位置，您的图像处理程序需要返回一行JSON，以告知TinyMCE图像的新位置。如TinyMCE文档中所提到的，这可能如下所示：

{ location : '/uploaded/image/path/image.png' }

TinyMCE会将图像的src属性更新为您返回的值。如果您在init中使用images_upload_base_path setting，那么它将被预置到返回的位置。

这里的网络是TinyMCE知道什么时候嵌入的图像存在于你的内容中，但它不可能知道在你的应用程序的上下文中如何处理该图像，以便作业（“图像处理程序”）是某种东西你必须创建。

至于你引用的问题...

如果浏览器不允许拖/放顺序，你可以看看使用像MoxieManager或elFinder等文件管理器，允许你上传通过用户界面显示图像，并将上传的图像一步显示在您的内容中。
图像大小总是一个问题。您可以在图像上传处理程序中的服务器上管理它，并在图像“太大”时返回错误。如果图像太大，您也可以编写自己的图像处理函数并完全停止上传。

来源

2016-04-26 14:10:56

谢谢 - 这是一个美妙的答案，正是我所追求的。不幸的是，感谢微软浏览器（似曾相识），文件管理器是必须的吗？否则，IE/Edge用户可能无法上传图像。我看到还有一个名为“Responsive Filemanager”的第三方浏览器也可以完成这项工作。 – Manachi

如问题所述，Internet Explorer 11和Edge浏览器似乎都不允许将图像拖入文本框。相反，图像似乎取代了整个页面（即它浏览到图像位置）。这是一个已知的问题？如果是的话，是否有任何微软的认可？这是故意的吗？还是会修复一个错误？ – Manachi

TinyMCE拖放图片上传问题

回答

相关问题