TikTok嵌入式视频不断消失

Question

我正在尝试将一个TikTok视频嵌入到我的网页中，但是当页面加载时，我会在视频布局消失之前看到它的一秒。这是从TikTok站点复制和粘贴的代码：

<blockquote class="tiktok-embed" cite="https://www.tiktok.com/@60secofserenity/video/6871965847380839686" data-video-id="6871965847380839686" style="max-width: 605px;min-width: 325px;">
    <section>
        <a target="_blank" title="@60secofserenity" href="https://www.tiktok.com/@60secofserenity">@60secofserenity</a>
        <p>
            <a title="duet" target="_blank" href="https://www.tiktok.com/tag/duet">##duet</a> with @dr.kyleross
            <a title="comedy" target="_blank" href="https://www.tiktok.com/tag/comedy">##comedy</a>
            <a title="fyp" target="_blank" href="https://www.tiktok.com/tag/fyp">##fyp</a>
            <a title="foryou" target="_blank" href="https://www.tiktok.com/tag/foryou">##Foryou</a>
        </p>
        <a target="_blank" title="♬ original sound - Dr. Kyle Ross" href="https://www.tiktok.com/music/original-sound-6863810291730303750">♬ original sound - Dr. Kyle Ross</a>
    </section>
</blockquote>
<script async src="https://www.tiktok.com/embed.js"></script>

在控制台上，我得到以下错误：

资源被解释为文档，但使用MIME类型的应用程序/json传输："https://www.tiktok.com/embed/v2/6871965847380839686?lang=en-US"。

我不知道如何从这个错误出发。我感谢您的任何建议，并感谢您的任何提示！

Answer 1

我也有过类似的问题。在这个问题上有两件重要的事情。

首先，我认为TikTok最近遇到了一些问题。不过，这只是我的猜测。除了我的代码，我一直在尝试使用来自GitHub的第三方项目，而嵌入代码在我的Chrome、Firefox和Safari上都没有用。正在发生的事情看上去和你描述的一模一样--布局出现了，几秒钟后就消失了。现在，没有对代码进行任何修改，我就不再有这个问题了。我认为写这件事很重要，以防将来发生类似的事情。

其次，如果使用嵌入代码作为更大项目的一部分，则添加像posts这样的TikTok嵌入代码，或者，例如，它们是React组件的一部分，请记住，在为Instagram添加区块引号部分后运行TikTok脚本，如Instagram中描述的here。否则，将加载的将只是一个TikTok视频布局。

Answer 2

我们有同样的问题，并通过从我们的.htaccess中删除以下内容来“修复”它。

Header set Referrer-Policy same-origin

该安全头阻止tiktok正确加载。如果我找到更多的信息，我会在这里更新。