gpt4 book ai didi

javascript - 将 SVG 分享到 Facebook

转载 作者:行者123 更新时间:2023-11-29 15:20:25 25 4
gpt4 key购买 nike

用户自定义 SVG,当他们满意时,我想为他们提供在 Facebook 上共享图像的选项。

我知道 Facebook 不接受 SVG,所以,在阅读之后 this问题,我想出了以下使用canvg:

var svgText = "<svg>" + $("#canvas2").html() + "</svg>";

canvg(document.getElementById('drawingCanvas'), svgText);

var img = document.getElementById('drawingCanvas').toDataURL("image/png");

尽管 .toDataURL 的命名,img 不是一个 URL(至少,我不认为它是),而是一个超过 10,000 个字符的字符串data:image/png;base64,... 的存在。

如果我然后尝试允许用户在 Facebook 上共享 PNG,

window.FB.ui({
href: "https://dna.land",
method: 'feed',
name: 'name',
link: "dna.land",
picture: img,
caption: 'mywebsite.com',
description: "description",
message: "message"
}, function(response) {});

我收到的错误消息是“需要参数 href”(我清楚地提供了......也许 img 太长并且 JSON 被 chop 了?),虽然我有还看到我没有为 picture 提供有效的 URL。

如何在 Facebook 上分享图像数据?

如果无法使用 PNG 的原始 base 64 编码来执行此操作,我不反对将 PNG 文件临时存储在服务器上。但是,理想情况下,我只会存储 24 小时、几个月或一小段时间,然后能够在用户的帖子不消失的情况下将其删除。这可能吗?

最佳答案

Despite the naming of .toDataURL, img is not then a URL (at least, I don't think it is), but a >10,000-character string that beings with data:image/png;base64,....

这正是Data URI方法!并且函数名称 toDataURL() 没有误导性。

在您的情况下,您需要将 Base64 编码 图像(由数据 URI 表示)转换为文件并将其上传到某处(可能在您自己的服务器或任何服务器上)云存储提供商,如 Amazon S3 或谷歌云存储),然后在 Facebook 上分享该网址。

在您自己的服务器上:
如果您要将其上传到您自己的服务器,那么您只需通过 ajax 发布数据 URL,将其转换为图像并返回该图像的 URL。要转换 Base64 图像,您需要寻找有关如何使用后端语言/系统进行转换的具体方法。例如,将Base64编码的图片转换成文件在

对于任何其他后端,只需执行 Google 搜索,您应该找到执行此操作的方法。

上传到第三方云存储服务:
如果您想将图像上传到任何第三方服务,您可以获得Blob使用 Canvas.toBlob() 从 Canvas 中删除对象函数并将生成的 blob 上传到提供者(可能通过使用他们提供的 Javascript/REST API)。据我所知,许多流行的云存储提供商将允许您上传具有适当 MIME 类型的 blob,但您应该始终检查是否支持。

关于javascript - 将 SVG 分享到 Facebook,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44293328/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com