Question

我有带有嵌入式Vimeo视频的Ionic应用程序。我按官方Vimeo documentation中所述嵌入了视频：

<iframe src="https://player.vimeo.com/video/...?api=1&autoplay=1" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

一切都在浏览器中运行良好。

在Android模拟器和真实设备中，视频以全屏模式播放。没关系。

当我尝试退出全屏模式时，会出现问题。在模拟器和一些设备上，当我按下后退按钮时，应用程序静默关闭，在其他设备上 - 应用程序关闭时出现错误。

我错过了什么？

如何退出播放器并导航回带有iframe的iframe的页面？

谢谢！

Answer 1

我设法使用cordova-plugin-streaming-media播放视频。但是你需要一个直接的.mp4链接到视频文件。这是我的理由，因为我们有一个Vimeo PRO帐户。

在控制器中：

var options = {
    orientation: "landscape"
};

$scope.playVideo = function() {
  window.plugins.streamingMedia.playVideo("http://.../video.mp4", options);
};

Answer 2

将插件更新为最新版本，并确保<iframe />标签不应位于<ion-item>内或任何离子标签内。只需将<iframe />标记包装在<div>标记中即可。它为我工作。这是我的代码。

<div>
  <iframe src="https://player.vimeo.com/video/301857805?api=1&loop=1&title=0&byline=0&portrait=0&autopause=1"
    frameborder="0" width="100%" height="100%" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
</div>

离子嵌入视频 - 退出全屏模式

2 个答案: