Javascript 从Raphael.JS图像以编程方式生成PNG

我正在编写一个应用程序，允许用户使用Raphael.JS生成图像。我想要的第二个特性之一是生成Raphael画布的PNG

以下是我脑海中的大致思路：

用户输入参数

我们通过Raphael调用生成JS

我们生成一个JS包装器，完成上述操作，并在包含的div上调用.innerHTML，为我们提供SVG（然后将其发送到某处）

我们执行JS包装器

SVG被发送到ImageMagick并弹出一个PNG

第四步是我需要一些指导的步骤。用户可能正在使用IE；我们不能保证JS会在SVG浏览器中执行。在任何情况下，我们都需要这个来运行服务器端，以使其可靠。到目前为止，我提出了三种可能性：

• 在服务器上安装Firefox并在Firefox中运行（3）的结果。这个选项很糟糕，因为安装FF意味着在我们的服务器上安装一堆X东西，运行FF会带来很大的开销，我真的不想在跟踪过程并在完成后终止它
• 使用Node.js+jsdom（）。这里的缺点是不清楚jsdom的支持程度——所谓的网站jsdom.org实际上并不存在。另外，我找不到任何文档
• 也许和犀牛做点什么？据我所知，Rhino的DOM支持甚至比Node还要差

---

所以…这三种选择都有点糟糕。我想。我错了什么吗？还有其他方法吗？

在通过ImageMagick运行之前，您可以尝试一下。我知道项目本身是PHP，但是转换是用XSL完成的（文件在下载档案中），因此应该可以移植到任何服务器平台。

一旦在客户端序列化了SVG文档，您只需要在服务器上运行SVG渲染器和/或光栅化器来生成PNG。我不清楚你认为JS包装器会做什么，或者为什么需要它。由于您正在发送的SVG文档将不包含动态内容，因此您需要将序列化的SVG文档发送到服务器上的光栅化器，以便将其光栅化为PNG

---

SVG渲染器/光栅化器可以是调用ImageMagick的CGI脚本，也可以是更复杂的东西。就我个人而言，我建议设置一个运行ApacheBatik的servlet，其中包括一个，并且可以通过编程方式调用。快速的谷歌搜索表明这是蜡染的一项非常常见的任务：

用wkhtmltoimage解决了这个问题。难看的解决方案，但有效。

很酷……谢谢。这可能真的管用——尽管一想到依赖用户浏览器的输出，我的蜘蛛感觉就很刺痛。我不能把我的手指放在风险上，但是依赖于运行的客户端有点让我害怕。你怎么想？我只是多疑吗？用户无法在不加载渲染页面的情况下创建Raphael图像，我想我们希望我们的用户启用了JS…@rfrankel当然，您永远不会相信来自浏览器的输入，而且即使使用格式良好的输入，也会有可能被利用（例如在XSLT引擎中），但我认为确认您的输入实际上是SVG将是一个良好的开端。当然，我甚至没有真正考虑安全风险（我知道如何处理），而是考虑边缘情况，即我们可以成功创建Raphael图像，但不能创建PNG，因为用户的浏览器做了一些奇怪或崩溃的事情。