AngularJS：在 iframe 中嵌入 Youtube 视频在 Android Chrome 上不起作用
AngularJS: Embedding Youtube videos in iframe does not work on Android Chrome
我正在使用 AngularJS 开发一个网络应用程序，我正在使用一个名为 youtubeResponsive 的嵌入响应式 Youtube 视频的指令，它允许在 iframe 中嵌入视频以视频 ID 作为源参数。
这一切都在桌面浏览器上完美运行，事实上我还设法嵌入了一个播放列表并循环播放。
我现在遇到的问题是Chrome Android，在 Nexus 5 设备上（运行 Lollipop 最新更新） 嵌入的视频没有显示，而是我可以看到正在进行下载的通知。每次刷新时，我都会看到下载过程重新开始，但没有显示视频。如果我单击下载通知以查看文件，则没有任何反应。
当然，我的目标是在移动设备上显示视频并自动播放和循环播放。
我可以看到使用 USB 调试在移动设备上检查页面的输出 (chrome://inspect/#devices)
<iframe id="ytplayer" type="text/html" width="100%" height="202.5" ng-src="http://www.youtube.com/v/ZhfUv0spHCY?version=3&autoplay=1&loop=1&controls=0&showinfo=0&rel=0&wmode=opaque" frameborder="0" allowfullscreen="" video-slug="ZhfUv0spHCY" class="ng-isolate-scope" src="http://www.youtube.com/v/ZhfUv0spHCY?version=3&autoplay=1&loop=1&controls=0&showinfo=0&rel=0&wmode=opaque"></iframe>
我在移动设备上没有看到任何错误，除了我在台式机上看到的相同警告，显然至少没有阻止视频播放。
Resource interpreted as Document but transferred with MIME type application/x-shockwave-flash:
"https://www.youtube.com/v/ZhfUv0spHCY?version=3&autoplay=1&loop=1&controls=0&showinfo=0&rel=0&wmode=opaque".
有人在 Android Chrome 或其他移动设备和 OS 上遇到过同样的问题吗？
我还没有开始在 AOSP 或 iOS 上进行测试，但已经在 Chrome 上测试了，这个问题非常令人担忧。如果有人设法修复它，请告诉我。
您特别要求旧的 Flash 播放器小部件，并且不允许它升级到 HTML5，这是现在任何类型的移动支持所必需的。您应该切换到 YouTube 播放器 API，它需要几行额外的代码才能实现，但几乎可以在任何地方运行，并为您返回大量有关视频播放等的事件数据。
https://developers.google.com/youtube/iframe_api_reference
您仍然可以通过此技术使用 IFRAME，但请考虑似乎支持当前 API:
的此指令
我正在使用 AngularJS 开发一个网络应用程序，我正在使用一个名为 youtubeResponsive 的嵌入响应式 Youtube 视频的指令，它允许在 iframe 中嵌入视频以视频 ID 作为源参数。
这一切都在桌面浏览器上完美运行，事实上我还设法嵌入了一个播放列表并循环播放。
我现在遇到的问题是Chrome Android，在 Nexus 5 设备上（运行 Lollipop 最新更新） 嵌入的视频没有显示，而是我可以看到正在进行下载的通知。每次刷新时，我都会看到下载过程重新开始，但没有显示视频。如果我单击下载通知以查看文件，则没有任何反应。
当然，我的目标是在移动设备上显示视频并自动播放和循环播放。
我可以看到使用 USB 调试在移动设备上检查页面的输出 (chrome://inspect/#devices)
<iframe id="ytplayer" type="text/html" width="100%" height="202.5" ng-src="http://www.youtube.com/v/ZhfUv0spHCY?version=3&autoplay=1&loop=1&controls=0&showinfo=0&rel=0&wmode=opaque" frameborder="0" allowfullscreen="" video-slug="ZhfUv0spHCY" class="ng-isolate-scope" src="http://www.youtube.com/v/ZhfUv0spHCY?version=3&autoplay=1&loop=1&controls=0&showinfo=0&rel=0&wmode=opaque"></iframe>
我在移动设备上没有看到任何错误，除了我在台式机上看到的相同警告，显然至少没有阻止视频播放。
Resource interpreted as Document but transferred with MIME type application/x-shockwave-flash:
"https://www.youtube.com/v/ZhfUv0spHCY?version=3&autoplay=1&loop=1&controls=0&showinfo=0&rel=0&wmode=opaque".
有人在 Android Chrome 或其他移动设备和 OS 上遇到过同样的问题吗？
我还没有开始在 AOSP 或 iOS 上进行测试，但已经在 Chrome 上测试了，这个问题非常令人担忧。如果有人设法修复它，请告诉我。
您特别要求旧的 Flash 播放器小部件，并且不允许它升级到 HTML5，这是现在任何类型的移动支持所必需的。您应该切换到 YouTube 播放器 API，它需要几行额外的代码才能实现，但几乎可以在任何地方运行，并为您返回大量有关视频播放等的事件数据。
https://developers.google.com/youtube/iframe_api_reference
您仍然可以通过此技术使用 IFRAME，但请考虑似乎支持当前 API:
的此指令