如何将推特链接转换为嵌入式推文？

Posted 2023-03-28

【中文标题】如何将推特链接转换为嵌入式推文？

【英文标题】：How to convert a twiiter link into an embedded tweet?

【发布时间】：2021-09-15 08:40:21

【问题描述】：

我正在构建一个从外部服务器获取数据的新闻网站。外部服务器经常向我发送特定推文的链接，但我似乎找不到将它们转换为嵌入式推文的方法 （请注意堆栈溢出不会让我发送缩短的 url，因此它在引号中。） 它发送给我的 json 就像 -

"Story": "ROME: Harry Kane scored twice as a buoyant England cruised through to the semi-finals of Euro 2020 with a one-sided 4-0 win over Ukraine in Rome on Saturday. Kane ended a worrying international scoring drought by netting in the 2-0 last-16 defeat of Germany in midweek and he put England ahead inside four minutes on a sweaty evening in the Italian capital. <a href="https://timesofindia.indiatimes.com/sports/football/euro-2021/ukraine-vs-england-live-score-uefa-euro-2020/liveblog/84098469.cms"><strong>As it happened: Ukraine vs England</strong></a> Gareth Southgate's side then put this quarter-final tie out of sight with two more goals early in the second half, one from Harry Maguire before Kane netted again. Substitute Jordan Henderson got the fourth, and as Denmark lie in wait in the Wembley semi-final on Tuesday England will be confident of going on to reach a first ever European Championship final and even now claiming a first major international title since 1966. <p>�������������� England = semi-finalists ������#EURO2020 | #ENG https://twitter.com/EURO2020/status/1411427976047120387"</p>— UEFA EURO 2020 (@EURO2020) <a href="https://twitter.com/EURO2020/status/1411430018262224897">1625346114000</a> The draw here was kind for them, with Ukraine surely as weak an opponent as they could hope to face in a quarter-final, a stage at which they have lost to the likes of Italy and Portugal in recent European Championships. However the statistics are impressive, with England having come through five games at this tournament all without conceding a goal. Some of their play in wide areas was outstanding, with Raheem Sterling and Jadon Sancho -- making his first start at the Euro -- too hot for Ukraine to handle. <p>⏰ RESULT ⏰What. A. Performance. �������������� Kane (2), Maguire & Henderson net in Rome as England reach EURO 2020 se… https://twitter.com/EURO2020/status/1411427976047120387"</p>— UEFA EURO 2020 (@EURO2020) <a href="https://twitter.com/EURO2020/status/1411427976047120387">1625345627000</a> Kane, their captain, had gone close to eight hours without finding the net for his country but his opener here was his second in just eight minutes following the late strike that secured victory over Germany. Regardless of the opposition, their display at the Stadio Olimpico was a step-up in class in the final third to previous games at the Euro and they will be favourites at home against a Danish side who played their own quarter-final against the Czech Republic on Saturday in distant Baku. This will be the only match England play away from home in the competition and it marked quite a difference to their defeat of the Germans, which was watched by more than 40,000 supporters at Wembley, where coronavirus restrictions were eased. <p>�������������� Two-goal England hero Harry Kane takes the plaudits after inspiring the Three Lions in Rome ��@Heineken |… https://twitter.com/EURO2020/status/1411427976047120387"</p>— UEFA EURO 2020 (@EURO2020) <a href="https://twitter.com/EURO2020/status/1411431548386172934">1625346478000</a> With Italy currently imposing a five-day quarantine on all arrivals from the United Kingdom, the number of England fans in Rome was limited to those already based in the European Union although they still made themselves heard in the crowd of under 12,000. They had plenty to celebrate, unlike their Ukrainian counterparts, as Andriy Shevchenko's team came up short in their bid to take the country to a first ever major tournament semi-final. They scraped out of their group and then edged 10-man Sweden in extra time in the last 16, and their chances of shocking England looked dead and buried when they fell behind early on. Sterling, who terrorised the Ukraine defence down the left, played in Kane who poked the ball past Georgiy Bushchan. Ukraine's giant striker Roman Yaremchuk forced a save from Jordan Pickford and a Declan Rice piledriver was kept out by Bushchan, with England looking comfortable. However Ukraine were a different proposition after injured defender Serhiy Kryvtsov was replaced by Dynamo Kiev winger Viktor Tsygankov in the 36th minute. They finished the first half strongly and more pessimistic England fans may have spent the interval reliving their exit from Euro 2016, when they lost to Iceland in the last 16 despite also having opened the scoring in the fourth minute. They need not have worried. England scored again less than a minute after the restart when a foul on Kane allowed Luke Shaw to deliver a free-kick from the left for Maguire to head in. Four minutes after that Sterling supplied the overlapping Shaw and he crossed for a rejuvenated Kane to head home. The Tottenham star nearly had his hat-trick, a stinging volley producing a fine save from Bushchan. From Mason Mount's resulting corner came the fourth goal, another header, this time from Henderson, the first of five substitutes sent on by Southgate who would have been thinking about the semi-final long before this quarter-final was officially over. ",

编辑：根据下面的回复。让我澄清一下我的服务器以 json 对象的形式向我发送数据，其中包含字符串。我使用 ejs 标签将这些数据传递到它们的适当位置以进行渲染。我在问如何将我的 json 对象中出现的每个 twitter url 转换为嵌入式推文。

编辑：这是我从服务器收到的 json，我可以在我的网页上很好地呈现它，但我似乎无法找到将超链接转换为嵌入推文的方法

【问题讨论】：

如果您解释一下help.twitter.com/en/using-twitter/how-to-embed-a-tweet 尚未涵盖这一点，将会有所帮助。您知道推文的 id (141143 ....)，所以只需使用 iframe embed src 并使用您需要嵌入的推文的 id。

这就是我无法利用服务器提供的内容的问题，我只是从已经呈现的网页中获取了它

我的服务器以 json 对象的形式向我发送数据，其中包含字符串。我使用 ejs 标签将这些数据传递到它们的适当位置以进行渲染。我在问如何将我的 json 对象中出现的每个 twitter url 转换为嵌入的推文。

【参考方案1】：

只需添加“https://publish.twitter.com/oembed?”在您提到的网址之前here。 您还可以按照链接中的说明自定义嵌入的推文。

响应会是这样的

  "url": "https://twitter.com/Interior/status/507185938620219395",
  "author_name": "US Dept of Interior",
  "author_url": "https://twitter.com/Interior",
  "html": "<blockquote class="twitter-tweet"><p lang="en" dir="ltr">Happy 50th anniversary to the Wilderness Act! Here&#39;s a great wilderness photo from <a href="https://twitter.com/YosemiteNPS">@YosemiteNPS</a>. <a href="https://twitter.com/hashtag/Wilderness50?src=hash">#Wilderness50</a> <a href="#">pic.twitter.com/HMhbyTg18X</a></p>&mdash; US Dept of Interior (@Interior) <a href="https://twitter.com/Interior/status/507185938620219395">September 3, 2014</a></blockquote>n<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>",
  "width": 550,
  "height": null,
  "type": "rich",
  "cache_age": "3153600000",
  "provider_name": "Twitter",
  "provider_url": "https://twitter.com",
  "version": "1.0"

您可以将 html 属性用作嵌入推文。

【参考方案2】：

我认为这应该适合你。 Twitter 提供了一个用于从推文 url 创建嵌入 html 的 api。

const axios = require('axios');


const main = async () => 

    const tweetURL = 'https://twitter.com/thejackbeyer/status/1411522480775204866?s=20';

    try 
        const response = await axios.get(`https://publish.twitter.com/oembed?url=$tweetURL`);
        console.log(response.data.html);
     catch (error) 
        console.error(error);
    



main();

【讨论】：

谢谢，但是当我尝试这个时，它向我显示了这个错误：- Uncaught SyntaxError: await is only valid in async functions and the top level body of modules

您需要将所有内容都粘贴到异步函数中的 try/catch 中。我将更新我的代码示例以显示。您应该能够将整个内容放到一个新文件中并运行它。