Wysiwyg与图像复制/粘贴

时间:2010-01-05 20:42:11

标签: web-applications html5 wysiwyg copy-paste clipboard-interaction

首先,我了解图像无法从本地计算机“复制”到网站中。我知道必须上传。我是一名网络程序员,熟悉常见的网络体验工具,如TinyMCE和FCKEditor。我的问题是,是否存在程序或网络模块或某种有效的东西将执行为所见即所得的图像的自动上传。我有一个客户经常抱怨无法将带有MS Word图像的文档复制/粘贴到所见即所得,以便在他们的网站上创建内容。

我已经研究过TX文本控制(http://labs.textcontrol.com/),并且正在研究一个可能在后台自动上传文件的flash wysiwyg。我不知道这是否存在,谷歌在我的搜索中没有太多帮助我,所以我想我会问其他编码员。

我对任何类型的服务器技术或浏览器要求都持开放态度。我正在寻找一些基于浏览器的工具,而不是像Dreamweaver或其他应用程序工具。

如果不存在问题的良好解决方案,我愿意接受这一点。

注意:这是客户的要求,对我而言似乎相当不合理。我决定收集社区建议而不是告诉客户“否”,这里的选项对于提供可能的解决方案非常有帮助和信息。

11 个答案:

答案 0 :(得分:28)

您可能会从ScreenshotMe找到灵感。

基本上你需要不同的部分:

  • 将图像从剪贴板中取出并将其上传到Web的内容:这可能是java applet,flash或firefox扩展。 Flash或Java具有跨浏览器的优势
  • ,那么您使用<canvas>标签一旦被上传到显示图像(使用explorercanvascanvas到Internet Explorer)

我在我的评论中指出,谷歌将停止支持HTML5的齿轮,看看7 User Interaction - HTML 5

编辑:

HTML5实现时应该与系统的剪贴板进行交互。我想以下场景可行:

到HTML5复制/粘贴拖放放大器;下降的实施,你必须依靠Flash或(签字)Java applet与剪贴板交互

答案 1 :(得分:3)

答案 2 :(得分:3)

我认为这是一个老线程,但如果有人还在寻找类似这样的东西(就像我一样),今晚我从一家名为Ephox的公司看到了一个名为textbox.io的产品(看起来像是他们买的TinyMCE也是如此)。

无论如何,这是第一个(如果不是唯一的)javascript / HTML5编辑器,我发现它使用他们称之为PowerPaste的专有插件成功粘贴来自word的图像。在初始粘贴时,它会提示再次粘贴以导入图像。工作就像一个魅力 - 我唯一的问题是,对于像我参与的每月500美元以上的创业公司而言,这是非常昂贵的(ZAR每月±R6,650 +),不幸的是,它的价格超出了我们的选择范围。 :(

答案 3 :(得分:2)

  

我有一个客户经常抱怨无法将带有MS Word图像的文档复制/粘贴到网站上以便在网站上创建内容。

这将失败。 MS Word不会创建有效的HTML,页面将显示为符合浏览器的用户。 Word也有一些奇怪的方法来锚定图像和流动不会翻译的文本。简而言之,Word是一个用于创作HTML的糟糕环境。

当然,您的客户可能不接受将我们带到选项2的那些:

由于您的客户选择将Word作为他们的WYSIWYG编辑器,因此将该内容粘贴到另一个 WYSIWYG编辑器中几乎没有意义。您的最佳解决方案是研究从Word或OPen Office自动导出HTML的方法。这可以使用VBA和服务器端脚本的组合来完成,首先将文档转换为HTML(这也将图像写入磁盘),然后将组合的内容上传到服务器。

答案 4 :(得分:2)

asp.net中没有直接选项,但你可以这样做

http://www.codeproject.com/KB/graphics/ClipboardActiveX.aspx

答案 5 :(得分:1)

仅限HTML

您可以使用(在拖放时)自动创建不可见HTML表单,文件输入,将文件名路径复制到fileinput并提交表单的内容。

您可以在不可见的iframe中创建表单,以便在不更改当前页面的情况下在后台发送表单。你知道,标准的Ajax程序。

放弃/粘贴的帮助

我不知道HTML是否允许删除文件项。如果不是,您可以查看Google正在努力推进的HTML 5规范。

另一种选择是使用某种富客户端组件(带有Swing或Flash的Java Applet,或者Silverlight或者wathever),至少要掌握文件(或粘贴)的删除以及创建HTML表单。

为什么我更喜欢发送表单

我更喜欢在发送文件的applet上创建表单,因为它不需要服务器上的其他特殊端口或类似的东西。

答案 6 :(得分:1)

我了解客户的困境。我正在做同样的事情,但目前没什么优先权,所以我不能提出任何解决方案,只需几个注释。

  • 当我将保存的 OpenOffice文档中的图像(无法使用未保存的文档)复制+粘贴到CKEDitor实例中时 - 我这里没有MS Word来测试但我认为它的工作原理类似 - 我将以下HTML插入编辑器中:

    <img src="file:///C:/Users/PEKKAG%7E1/AppData/Local/Temp/moz-screenshot-4.png">

    有可能调整Flash或Java上传器的方式是只需用户很少的交互即可获取此文件。能够从用户的计算机获取文件是一个可怕的安全漏洞,但是至少可以预先设置一个上传器到临时目录目录。

  • 然而,Gregory Pakosz提到的 Canvas 方法我觉得最有趣,因为这样可以可以静默地将图像存储在服务器端,没有任何上传。但是,与上例相同的安全限制仍然适用:图像位于不同的域上,因此页面上的脚本无法读取。人们必须找到一种解决方法,使用浏览器设置或编写自定义扩展。

答案 7 :(得分:1)

如果我理解你的问题, 你的客户可以有任何随机的Word 文件和其中一些文件 可能包含图像。

您似乎描述的内容类似于内容 管理在某些方面和创造静态 其他人的网页。

我会说你的客户希望访问他们的访问者 网站,以查看HTML页面等文件 作为Word MIME类型。

一些选项:

  • 使用Word保存为HTML。不是最干净的HTML  但可能是最干净的解决方案。

  • 让您的客户购买Dreamweaver等产品  这将导入他们的Word文档  并清理Word生成的HTML。

  • 如果您的客户有很多钱,请制定一个习惯  使用VSTO的解决方案

答案 8 :(得分:1)

  

我的问题是,是否存在程序或网络模块或某种有效的类型将为所见即所得自动上传图像

XStandard Pro会将图像上传到从Word或其他应用程序/文件系统粘贴的服务器。

答案 9 :(得分:0)

在寻找类似的解决方案时,我注意到GMail允许,如果你正在从浏览器中复制和粘贴。

如果您从Word复制,它似乎知道图像的尺寸(您可以看到图像的轮廓)但它实际上并不粘贴/上传图像。

从非Office桌面应用程序似乎没有支持。

所以假设谷歌的工程师已经花了一些时间来处理这个问题,我怀疑桌面应用程序还没有这么做,但是如果你能找到一种快速的方法将内容保存到网上(例如使用Word的话)如果您的客户准备采取额外步骤并且您可以将它们直接保存到Web服务器,则可以从中复制并粘贴该博客或另存为HTML功能。

尼克

答案 10 :(得分:-1)

名为Redactor的WYSIWYG编辑器允许将图像直接复制粘贴到编辑器中,而不是单击上传图像按钮。

此处a link to their copy-paste example