2

我有一个 Highcharts 图表，我在 Rails 3.2 应用程序中使用以下 javascript 将其从画布转换为 Base64。

canvg(document.getElementById('chart'), chart.getSVG())
var canvas = document.getElementById("chart");
var img = canvas.toDataURL("image/png");
document.write('<img src="'+img+'"/>');

现在，我想将该图像解码为图像文件。但是，我不想将它保存到服务器，因为唯一的目的是在 Facebook 上分享。我看到两个选项：

- 将数据从img回发送到服务器，然后将其转换为存储在临时文件夹中的图像，并在视图中呈现。

- 使用 javascript 将 Base64 解码为 PNG 文件并在新窗口中打开。

我应该采取哪个方向以及如何实施？我已经用谷歌搜索了几个小时，并找到了一些可以满足我需要的部分示例，但我找不到整个故事。

这个解决方案看起来很有希望，但是我的图像太大而无法使用 get 请求，而且我对 javascript 不是很熟悉，所以我尝试使用 post 请求失败了：

使用 ruby​​ on rails 和 javascript 将画布转换为图像并在新窗口中打开

编辑：作为另一个潜在的解决方案，是否有一个网络工具可以发送 base64 字符串，该字符串将自动返回图像链接？

4

1 回答 1

0

简而言之：您的第一个选择是最好的

长版：我不确定您是否可以使用 base64 网址在 facebook 上发布 - 原因与您不能对巨大的 base64 字符串使用 GET 请求相同（它们是否支持那么长的网址？） - 所以您可能实际上需要保存这些图片。

我不确定，但我认为只有用户直接发布的图片（未通过“共享”按钮链接）保存在 Facebook 端，其他图片实际上位于您的服务器中。

首先，您应该测试是否直接通过 facebook API 发送巨大的 base64 字符串 - 我尝试使用 FB 的在线工具为小图像创建一个图形 api 元标记，但它没有用，所以这看起来不太好（虽然我承认我不太了解 FB API）。

让我们承认您必须永久保存此图像 - 通过 AJAX POST 请求将其发送到您的服务器并不难。如果您使用JQuery，它甚至非常简单。之后只需使用 ruby​​ 将 base64 转换为图像文件。

编辑：我只是想知道我是否很好地理解了这个问题。您只是希望您的用户能够下载创建的图像吗？如果是这样，他们只需右键单击>保存生成的图像。canvas2image库甚至可以使“右键单击受损”用户更容易；）

编辑 2：这是一个带有 JQuery 的 ajax POST 请求的示例：

$.post( 
  // first argument : the URL you want to POST to
  'url/to/post.js',
  // second argument: the data to send to the server
  myData,
  // third argument : a callback function, 
  // that is called when the request is complete
  // and is passed the data returned by the server 
  // + response status (success, error...)
  function( data ){    
    alert('request completed, returned :' + data);
  });

所以在你的情况下，你可以做这样的事情：

$.post(
  '<%= create_facebook_image_path format: :js %>',
  { base_64_string: img },
  function( data ){
    $('#viewport').append( $('<img />').attr({ src: data.url }) );
  });

JQuery 的文档中提供了更多示例，包括如何处理成功/错误状态。我建议你学习使用 JQuery，你很快就会发现它是多么简单而强大！

于 2012-11-17T12:46:39.303 回答