嵌入式YouTube视频JS API DOMException NotAllowedError

时间:2020-09-28 17:58:02

标签: javascript video youtube

当我尝试在未设置任何断点的情况下使用YouTube嵌入式视频JavaScript API在未设置任何断点的情况下使用YouTube嵌入式视频JavaScript API自动播放嵌入式YouTube视频时,调试器将在6021行的base.js脚本中停止,并显示以下内容:

[[PromiseState]]: "rejected"
[[PromiseResult]]: DOMException: play() failed because the user didn't
                                 interact with the document first.
                   code:         0
                   message:      "play() failed because the user didn't
                                  interact with the document first."
                   name:         "NotAllowedError"

如果我按下脚本调试器的“恢复脚本执行”按钮,则视频将正常播放,并且事件处理程序将正常工作。

但是,我网站上的用户(而不是CodePen演示版)已经必须单击播放按钮才能在具有指定了自动播放网址参数的iframe中显示视频,因此我宁愿他们不必再按另一个播放按钮以实际观看视频。

这是指向我的CodePen debug demo webpage的链接,该链接在打开Chrome Inspect脚本调试面板时显示错误。

要查看错误:

  1. 运行Google Chrome。
  2. 在上方打开上述链接(https://cdpn.io/howardb1/debug/qBZvoea/xnMabZnmQDwr) 一个新的标签或窗口。
  3. 通过右键单击页面的打开区域以打开Chrome Inspect, 显示弹出菜单,然后选择“检查”。
  4. 刷新网页。

当脚本调试器在第6021行的承诺被拒绝的错误上暂停时,这将导致base.js页面加载。异常详细信息未在控制台中显示,但是您可以按一下step按钮来查看它们,然后将鼠标指针悬停在 a 变量上,或将 a 添加到监视面板或控制台面板,然后展开其详细信息。

我该如何解决这些问题,使NotAllowedError不会发生或是否发生,因此我可以捕获它,然后采取措施使视频真正播放?

我确实看过Google Chrome AutoPlay Policy Changes页,尽管它确实讨论了使用iframe的问题,但我没有看到或理解我要克服这个错误所要做的事情。我怀疑,如果它必须嵌入我要嵌入YouTube视频URL的标签内部的标签,那么我对此无能为力。

更新整个早晨都没有兑现承诺的CodePen演示已经开始挂起加载视频或在脚本调试器面板未打开时实际自动播放。我没有对该页面进行任何更改。无论如何,我会说这个问题没有解决,因为我不能正确地依靠视频的播放。

谢谢。

0 个答案:

没有答案