HTML 分享到Twitter

Posted 2021-05-24

<a href="http://twitter.com/home?status=Currently watching http://www.test.com/post-url" title="Click to share this post on Twitter">Share on Twitter</a>

无需卡即可将图像分享到 Twitter

【中文标题】无需卡即可将图像分享到 Twitter

【英文标题】：Share Image to Twitter without Card

【发布时间】：2017-11-01 18:56:49

【问题描述】：

给定某个地址的图片，http://www.thissite.will/never/be-finished.png，将其分享到 Twitter 的最简单方法是什么，最好不用卡片？

---

用户自定义 SVG，当他们满意时，我将其转换为 PNG 并将其存储在我的服务器上。

我想让他们选择在 Twitter 上分享图片。他们点击一个按钮（我可以实现），然后打开一个对话框，他们可以在其中添加到推文（应该已经包含图片）。

我知道以前在这个网站上也有人问过类似的问题，但我确实不想使用“卡片”来分享图片。相反，我想要一个典型的、非卡片式推文，只有一张图片（如this）。

我反复浏览了 Twitter 开发人员文档，但找不到有用的信息。不推荐使用POST statuses/update_with_media 方法，并且建议替换“上传媒体指南”的链接已损坏。我认为This guide 是它打算链接的内容，但它没有 JavaScript 代码来建议应该如何实际实现。

请帮忙。

---

我的尝试，基于POST media/upload：

$.ajax(
    url: "https://upload.twitter.com/1.1/media/upload.json", 
    format: "post", 
    data: "data" : link
).success(function(response) 
    console.log(":)");
    console.log(response);
).fail(function(response) 
    console.log(":(");
    console.log(response.responseText);
);

这失败了。 responseText 是 "errors":["code":215,"message":"Bad Authentication data."]。

---

基本上，我想做一些类似于 *** 所做的事情。当您单击问题上的“共享”，然后选择 Twitter 时，会弹出一个新窗口，其中包含指向问题的链接，用户可以在其中编写自己的消息。 （Twitter 提供了接口。）

然而，在我的情况下，当发送推文时，而不是有返回页面的链接和从中提取的一些文本，我只想有一张图片。

【问题讨论】：

data:.. 实际上不是 URL，而是Data URI

@StefanHegny 谢谢！这有帮助。关于如何将其分享到 Facebook 的想法？

不是真的，抱歉。希望一些专家加入...你想分享到 FB 或 twitter 吗？您似乎将这两者混为一谈（现在您说的是 facebook，但问题被标记为 twitter）

@StefanHegny 推特。对不起！ （嗯，两者都有，但 Facebook 是我在另一个问题中描述的稍微不同的情况。）我会解决这个问题。

好的，所以我不能编辑赏金文本 (?)，但我的意思是我正在寻找一个共享 PNG 数据的程序（因为我已经如上所述）在 Twitter 上，而不是 SVG 数据，因为我已经完成了更改格式的工作。

【参考方案1】：

Twitter 没有官方的图片分享方式。你必须使用Twitter card。这是我的one webpage with nice image。在Twitter card validator 上测试该 URL，您将获得相当的图像。这就像您在彭博社的推特状态链接中的示例。 Now you can click this link to tweet which is of my that webpage（当然你可以删除那条推文，这是测试的例子）。您将获得带有自定义文本选项的大图像。这些都是你想要的。

在 Twitter 上分享超链接的参数

我给你的超链接是这样的：

https://twitter.com/intent/tweet?text=Cheapest%20CDNs%20With%20HTTPS%2C%20IPv6%2C%20HTTP%2F2%2C%20Brotli&url=https%3A%2F%2Fthecustomizewindows.com%2F2017%2F06%2Fcheapest-cdns-https-ipv6-http2-brotli%2F&hastag=AbhishekGhosh&via=AbhishekCTRL&original_referer=https%3A%2F%2Fthecustomizewindows.com%2F2017%2F06%2Fcheapest-cdns-https-ipv6-http2-brotli%2F

https://twitter.com/intent/tweet 是常数部分。 ?text= 是您想要的文本。 &url= 是您将分享的 URL。 &via= 是可选的关联帐户。 &original_referer= 在大多数情况下与&url= 相同，&hashtags 是您想要的人质。 &hashtags 不起作用。

但你想要的是图片而不是网页。这很棘手。

你需要什么

你想要的需要像 PHP-MySQL 这样的 web 软件。应用程序将为用户生成的带有图像的网页编写一个唯一的 URL，超时用户使用 Twitter 卡的 HTML 标记完成工作。 Twitter 卡与网页如何具有标记、图像、哪个域的网站管理员设置等有关。您可以使用类似 PHP 的语言通过网页的 HTML 标记设置首选图像。

原型应用示例

作为使用 WordPress 开发的这种想法的示例，当我还没有发表文章时，我有图像，但预览的 URL 是私有的。在 WordPress 中可以公开未发表的文章。可以使用 4 个 WordPress 插件作为基本示例进行测试：

https://wordpress.org/plugins/public-post-preview/（使未发布的帖子有公开预览） https://wordpress.org/plugins/developer-share-buttons/（生成推特分享链接） https://wordpress.org/plugins/twitter-cards-meta/（生成推特元标签） https://wordpress.org/plugins/live-composer-page-builder/（为注册用户提供一种在 WordPress 前端进行编辑的方式）

当然有更新的 WordPress API 可以在其他服务器上执行此操作。