我有一个Ionic App,我想部署到
Android Play商店,我的应用程序只有1个标签上有一个视频列表,然后当你点击1个视频时它然后使用像这样的iframe在另一个标签中播放视频
<div class="video-container"> <iframe id="VideoPlayer" ng-src="{{getIframeSrc(videoid)}}" frameborder="0" width="560" height="315" allowfullscreen></iframe> </div>
一切正常.问题是由于YoutubeAPI Google Play商店政策,您不允许您的应用在后台播放YouTube视频或音频,例如当您最小化应用或转移到其他标签时.
实现这一目标的最佳方法是什么?我需要确保当你最小化或移动到另一个标签时,如果用户没有自己停止,它将阻止youtube视频从iframe播放.
******* UPDATE ********
$scope.stopVideo = function() { var iframe = document.getElementsByTagName("iframe")[0].contentWindow; iframe.postMessage('{"event":"command","func":"' + 'stopVideo' + '","args":""}','*'); }
但是这只有在我使用Ionic Serve进行测试时才有效,如果我在Android手机上运行相同的代码,我会得到参考错误:Div Not Defined.不知道为什么这会在浏览器中运行,但在Android上运行时不会在应用程序上运行.
我还需要在Ionic中了解如何在您可能没有看到应用程序的每个场景中调用此函数,因此要将应用程序关闭到后台,转到新选项卡,请按返回按钮…是否有我可以添加这个函数来调用所有这些场景吗?
解决方法
Ionic2的解决方案,使用TypeScript
ionViewWillLeave() { let listaFrames = document.getElementsByTagName("iframe"); for (var index = 0; index < listaFrames.length; index++) { let iframe = listaFrames[index].contentWindow; iframe.postMessage('{"event":"command","func":"pauseVideo",'*'); } }
不要忘记在视频链接的末尾启用JS *?enablejsapi = 1