是否有TinyMCE的拖放/粘贴图像插入(上传)插件或类似插件?

时间:2012-08-02 19:30:45

标签: jquery html5 tinymce

在Gmail中,只需从本地文件浏览器(而不是网址)拖放图片或将复制的图像粘贴到其中,即可在新邮件/回复窗口中上传内嵌图片。

是否有一种简单的方法可以将此功能添加到TinyMCE编辑器中?如果没有,有关如何以最佳和/或最简单的方式完成此任务的任何想法?

更多信息/需求:

  • 定义的“放置区域”不可用,因为放置/粘贴的图像必须准确出现在用户将其放入/粘贴到TinyMCE窗口中的位置(即两段文本之间)。
  • 在上传或上传后处理/调整图片大小,即最大值。最好是500kb。
  • 出于与上述相同的原因 - 并且出于易于使用的原因 - 用户不应显示任何对话框,就像Gmail刚刚开始上传图片一样,没有问题。
  • 丢弃/粘贴到TinyMCE的任何图像都将与Amazon Simple Storage Service(S3)一起存储。来自Tiny的文本将存储在我们的数据库中。将粘贴的图像存储在数据库而不是Amazon S3中可能是一种选择(使用Heroku和PostgreSQL)。
  • 文本和图像 - 按照正确的顺序/上下文 - 应在稍后的计时器上再次呈现给用户,因此在删除/粘贴图像时,或者在保存TinyMCE表单时,占位符或与必须将图像信息写入TinyMCE,以便我们知道在将来某个时候需要检索时,哪个图像以及文本中的哪个位置。
  • 网站正在使用Rails 3.1.3,很快就会升级到3.2。
  • HTML5只是很好,即HTML4兼容性并不重要。

非常感谢你! : - )

PS。我在谷歌搜索了+看了类似的问题而没有找到正确的解决方案。

3 个答案:

答案 0 :(得分:2)

我使用了plupload很多,发现它非常有用,适用于html4,当浏览器没有flash或silverlight或html5时这是一个要求。你看过那个了吗?我记得看过关于亚马逊和S3的this。祝你好运!

答案 1 :(得分:1)

你可以尝试 jQuery File Upload ,它有拖累;放弃支持。

你也可以通过25+ jQuery Drag and Drop Plugins来完成(或改编一个)。

希望这有帮助。

答案 2 :(得分:0)

好的,这有点奇怪。甚至编辑也使用这个技巧来使用base64进行编码:

<img alt="" src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/4gxYSUNDX1BST0ZJTEUAAQEAAAxITGlubwIQ..

我认为是可以的,但是有4-5张合理尺寸的照片查看帖子导致服务器负载跳到疯狂的水平.. http取100%等...如果超过一两个人的话,它会让我们失望查看帖子。有趣的是,它们在编辑器中显示得很好 - 当你在疼痛发作时保存和发布时。不太确定为什么这样点击apache如此难以显示帖子(在编辑器中看起来很好)