YouTube iframe嵌入违规：非被动事件监听器阻止'touchstart'事件的滚动

Question

我正在网站上嵌入一个Youtube的iframe，但是它在我的控制台中抛出以下警告:

[违规操作]添加了非被动事件监听器到一个阻止滚动的'touchstart'事件。考虑将事件处理程序标记为“被动”以使页面更加响应。请参见https://www.chromestatus.com/feature/5745543795965952 base.js:4560

[违规操作]'setTimeout'处理程序耗时115毫秒www-embed-player.js:583

我确定是这个组件引起的，因为当我注释掉它时，警告就停止了。我想要摆脱这些警告。该怎么做？

<iframe width="100%" height="300px" src="https://www.youtube.com/embed/wHcyxs6pGIk" frameborder="0" allow="accelerometer; autoplay; gyroscope; picture-in-picture" allowfullscreen></iframe>

- Ansjovis86

---

您能否添加代码，展示您是如何嵌入视频的？ - Pietro Nadalini

我遇到了完全相同的问题... - Alvaro

你解决了吗？我遇到了一个错误，当我嵌入视频时，会弹出Youtube的错误窗口... 有任何想法吗？ - webkit

还没有解决。 - Ansjovis86

有进展吗？我这里也遇到了同样的问题。 - Medin

Answer 1

我一直遇到同样的错误。这是我看到唯一解决此问题的帖子。在链接中，警告指示您查看：Github EventListenerOptions/explainer.md

文档中说：

有一些更复杂的情况，其中处理程序只想在特定条件下抑制滚动，例如： ... 一个 UI 元素（如 YouTube 的音量滑块），它在水平滚轮事件上滑动而不改变垂直滚轮事件的滚动行为。由于没有“touch-action”的滚轮事件等效项，此情况只能使用非被动滚轮侦听器实现。

看起来这个错误是由于 YouTube 的音量滑块不可避免的。

- Clean Fusion