在 iOs 和 Android 的 PhoneGap/Cordova-app 中播放视频
Posted
技术标签:
【中文标题】在 iOs 和 Android 的 PhoneGap/Cordova-app 中播放视频【英文标题】：Playing video in PhoneGap/Cordova-app for iOs and Android 【发布时间】：2013-08-29 22:12:44 【问题描述】：我需要在基于 PhoneGap 2.7 构建的应用中播放视频。是否有可能让 iO 和 android 都适用 - 涵盖当今大多数 Android 设备？
最好从本地位置播放视频文件，以便视频文件实际上是应用程序的一部分。 （其他视频文件可以在播放前下载保存。）
【问题讨论】：
【参考方案1】：您可以使用html5 video tag 在您的应用程序中播放视频。
在 Cordova 应用程序中使用 video 标签时（尤其是在 Android 设备上）有一些怪癖，但它的支持在较新版本的 Cordova 中得到了很大改进，因此请确保您针对的是最新版本。
【讨论】：
【参考方案2】：我知道这是一个老问题，但它仍然出现在搜索中。
对于在 Cordova 应用程序中播放视频，根据我的研究，目前最好使用的插件是：
https://github.com/nchutchind/cordova-plugin-streaming-media
这会在本机播放器中播放本地或流式视频，可配置，并保持最新。
请注意，HTML5 视频在 Android 版本上确实有奇怪的怪癖，在 iPhone（但不是 iPad）上，无论如何，视频都会自动在原生 iPhone 播放器中播放，这使得 HTML5 视频标签成为恕我直言的糟糕选择，如果你希望在您的应用程序中包含视频。
【讨论】：
【参考方案3】：还有另一种在 ios 设备上播放视频的选项。使用cordova-plugin-streaming-media。
这是这个插件与cordova-plugin-file合作播放本地应用程序媒体文件的代码示例。
var path = cordova.file.applicationDirectory + "www/media/video.mp4";
if (cordova.platformId == 'ios')
var options =
successCallback: function ()
console.log("Video was closed without error.");
,
errorCallback: function (errMsg)
console.log("Error! " + errMsg);
,
orientation: 'landscape'
;
window.plugins.streamingMedia.playVideo(path, options);
祝你好运！
【讨论】：
你好，我以前永远不会尝试播放视频。我在 ionic 平台上工作，并为 android 和 iOS 平台创建与视频新闻相关的应用程序。所以我面对的所有视频都来自 Web API，并在我的应用程序 UI 中以多个缩略图呈现。那么您认为哪个视频插件可以很好地满足我的要求。？或者你对此有什么想法？。【参考方案4】：你可以使用这个插件
cordova 插件添加https://github.com/ednasgoldfishuk/VideoThumbnail.git
用代码
cordova.plugins.videoPlayer.play("file:///android_asset/www/resources/loading/your_video.mp4");
【讨论】：
【参考方案5】：在 iOS 上，您可以使用 HTML5 视频标签来播放本地文件，但在 Android 上这是不可能的。
我建议使用 macdonst 的 PhoneGap 的 VideoPlayer 插件
https://github.com/macdonst/VideoPlayer
此外，这里还有一些示例代码，可让您在安装插件后开始使用。
<body onload="javascript:init()">
<div class="app">
<p><a href="#" onclick="playVideo('https://www.youtube.com/watch?v=gYOLV66XukY')">Play File</a><p/>
</div>
<script type="text/javascript" src="cordova-2.3.0.js"></script>
<script type="text/javascript" charset="utf-8" src="video.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript">
app.initialize();
function init()
document.addEventListener("deviceready", console.log('ready'), true);
function playVideo(vidUrl)
window.plugins.videoPlayer.play(vidUrl);
</script>
来源： https://gist.github.com/macdonst/1507162
【讨论】：
请查看this以上是关于在 iOs 和 Android 的 PhoneGap/Cordova-app 中播放视频的主要内容，如果未能解决你的问题，请参考以下文章
如何在 Android 的原生视图之上覆盖 PhoneGap 的 CordovaWebView？
在启动时加载外部链接的 Phonegap 应用程序 - Android