我非常确定 YouTube Iframe API“onError”事件过去会触发,因为我运行一个基于此 API 的项目。但最近“onError”事件不会触发,即使是最简单的错误。
这是一个基于官方页面的简单示例代码(https://developers.google.com/youtube/iframe_api_reference https://developers.google.com/youtube/iframe_api_reference)并且是可行的:
<iframe id="existing-iframe-example"
width="640" height="360"
src="https://www.youtube.com/embed/M7lc1UVf-VE?enablejsapi=1"
frameborder="0"
style="border: solid 4px #37474F"
></iframe>
<script type="text/javascript">
var tag = document.createElement('script');
tag.id = 'iframe-demo';
tag.src = 'https://www.youtube.com/iframe_api';
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('existing-iframe-example', {
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange,
'onError': onError
}
});
}
function onError(event) {
console.log(event.data)
}
function onPlayerReady(event) {
}
function onPlayerStateChange(event) {
console.log(event.data);
}
</script>
一旦将视频 ID 字符串“M7lc1UVf-VE”更改为错误的字符串,例如“M7lc1UVf”,它应该触发“onError”事件,但现在不会。
根据官方页面指南:https://developers.google.com/youtube/players/support https://developers.google.com/youtube/players/support→“Google工程师使用youtube-iframe-api标签监控并回答问题”,希望Google工程师能够看到这篇文章并修复“onError”问题。
我找到了解决这个问题的方法。我发现,至少就我而言,onError
回调不会在初始加载时触发(当最需要的时候!),但会在播放器的其余部分完全加载后触发。
如果您绝对需要onError
如果事件起作用,您可以在已加载的播放器中重新加载视频。去除autoplay
参数来自playerParams
对象——这会导致黑客失败。添加loadByVideoId
(用于自动播放)或cueByVideoId
具有相同的视频 IDonReady
打回来。
这将重新加载当前视频和onError
如果需要,回调将被触发。否则,除了视频在播放前短暂提示之外,几乎不会有任何明显的效果,如果autoplay
是期待。
如果您想了解更多信息,请告诉我 - 希望有帮助!
EDIT:
-
这是一个 codeandbox 演示问题. https://codesandbox.io/s/react-youtube-demo-forked-wyenn?file=/src/App.js请注意,
在单击“重置”按钮之前,错误不会添加到列表中。
(截至 2022 年 2 月 12 日,该错误仍然存在。)
-
这是一个 codeandbox 演示解决方法我发现。 https://codesandbox.io/s/onerror-issue-workaround-xgjx7?file=/src/App.js注意
onReady
回调,以及列表中填充的错误。
更新:
我不知道它是什么时候发生的——谷歌的开发人员从未更新过我的问题——但看起来这个错误可能已经解决了。第一个演示现在按预期列出了加载时的错误代码。对于实施此解决方法的任何人,您现在也许可以删除该黑客攻击。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)