从tiktok嵌入视频

Question

我有当前的片段，我想要的是获取视频的URL，但它只是显示了一个没有样式的文本。

  async function start() {

    let url = "https://www.tiktok.com/@tiagogreis/video/6830059644233223429";
    let contentlist = document.querySelector("#content");

      let data = await loadDataFromURL(url);
      contentlist.innerHTML = data.html;
  }

  async function loadDataFromURL(url) {

    let oembed = `https://www.tiktok.com/oembed?url=${url}`;
    console.log("the oembed link", oembed);

    let dataFromOembed = await fetch(oembed);
    let data = await dataFromOembed.json();
    if (data === undefined) {
      throw Error("No data received from oembed");
    }

    console.log("the data from oembed", data);

    return data;
  }

  start(); 

这是我想要的视频URL。你能帮帮忙吗？

Answer 1

我将继续查看tik tok中关于嵌入定位here的开发人员文档。它看起来好像有一个特定的链接，开发者想要用于来自其他网页的请求。该链接应该类似于下面的内容：

https://www.tiktok.com/oembed?url=https://www.tiktok.com/@scout2015/video/6718335390845095173

这就是您所拥有的，它返回一个带有HTML条目的json对象，其中包含使用Tik Tok的播放器嵌入视频所需的所有数据。因此，您可以将data.html附加到站点中的一个元素，以添加他们的播放器。这很可能显示为未设置样式的文本，因为实际上并没有执行最后一组标记。如果你把这些标签放在html中的某个地方，代码应该会执行并嵌入视频。

<script async src='https://www.tiktok.com/embed.js'></script>

Answer 2

您可以使用/embed/v2/:videoId接口。如下所示：

const tikTokFrame = document.createElement('iframe');
tikTokFrame.width = '100%';
tikTokFrame.height = '500';
tikTokFrame.src = 'https://www.tiktok.com/embed/v2/6718335390845095173';