reactjs iframe导致很多cookie问题

bnlyeluc 于 2023-03-29 发布在 React

关注(0)|答案(2)|浏览(169)

bounty将在6天后过期。回答此问题可获得+50的声望奖励。JohnPix正在寻找规范答案。

我试图通过使用<iframe在我的NextJS网站上嵌入一个视频。问题是它在Chrome浏览器中导致了很多cookie问题。加上性能显着下降。

<iframe
  src="https://www.youtube.com/embed/r9jwGansp1E"
  allowFullScreen
></iframe>

我也尝试使用aspect-ratio plugin，但我得到了同样的问题，页面呈现空白。

<div className="aspect-w-16 aspect-h-9">
  <iframe
    src="https://www.youtube.com/embed/r9jwGansp1E"
    allowFullScreen
  ></iframe>
</div>

问题是我做得对吗？或者应该用另一种方法来嵌入视频并避免问题？

2条答案

最好使用react-player这样的库来嵌入视频，而不是使用iframe，因为iframe有时会导致跨源问题。

首先，您将无法解决此警告，因为您无法设置sameSite属性，因为youtube是第三方服务。
如果您在本地环境中有此问题，请不要担心，当您使用HTTPS部署到生产服务器时，它应该会消失，它可能与HTTP协议有关。