Cordova iOS：使用下载的 html 和视频文件加载视频

Question

我有以下问题：

• 我有一个 iOS Cordova 应用程序。
• 应用程序下载一个 zip 文件并使用以下 Cordova 插件将其解压缩到“cdvfile://localhost/persistent/content/myfolder”中：org.apache.cordova.file-transfer、org.apache.cordova.file和https://github.com/MobileChromeApps/zip.git
• 在 zip 里面有一个“index.html”文件，上面有“视频标签”。
• 我能够成功加载并执行“index.html”文件，但视频无法加载。

我知道视频文件解压成功是因为：

• 我检查了 iPad 中的文件。

• 我通过以下方式将视频嵌入到cordova应用程序（不是下载的应用程序）的索引中，并且可以正常工作：

   var videocontainer = document.getElementsByTagName('video')[0];
   var videosource = document.getElementsByTagName('source')[0];
   var newmp4 = cordova.file.documentsDirectory + 'content/myfolder/videos/myvideo.mp4';
   videosource.setAttribute('src', newmp4);
   videocontainer.load();
   videocontainer.play();
  

但是，视频并未在下载的 HTML 文件中加载/播放。要了解我在做什么，我必须开发一个应用程序，该应用程序将通过从 zip 下载其内容来更新，并且内容包括嵌入了视频的页面。它适用于 PC 和 Android，但不适用于 iOS。

我尝试了以下方法：

• 正在“_self”中加载页面。显示页面，但不显示视频。
• 在 iframe 中加载页面。结果相同。
• 在 inAppBrowser（插件）中加载页面。结果相同。
• 源 src="videos/myvideo.mp4" 的视频标签（适用于 Web 和 Android）。结果相同。
• 源 src="./videos/myvideo.mp4" 的视频标签（适用于 Web 和 Android）。结果相同。
• 源 src=cordova.file.documentsDirectory + 'content/myfolder/videos/myvideo.mp4' 的视频标签（使用 JS，通过在查询字符串中传递路径，与根 index.html 中的路径相同我之前描述过）。结果相同。
• 源 src=cordova.file.documentsDirectory + 'cdvfile://localhost/persistent/content/myfolder/videos/myvideo.mp4' 的视频标签。结果相同。
• 以前的所有东西的组合。结果一样......

在 DIV 中加载下载的资源不是一种选择，因为资源（图像、css、javascript、音频、视频等）是在其他 iOS 设备的文件夹中下载的：应用程序的 Documents 文件夹 (cdvfile://本地主机/持久/）。

我几乎尝试了所有方法...为什么在 html 中播放视频标签并非易事，它们都在应用程序的 Documents 文件夹中？？？

:-(

编辑 1：Cordova 版本 = 3.6.3

Answer 1

我猜您将视频链接编码到您在设备上解压缩的 zip 中的 index.html 中。

在您在 phonegap 应用程序中实际加载或导航到此页面之前，需要使用一些 javascript 解析器“更新”这些链接。

如果您的示例是在 Android 中引起的，您肯定需要在此处包含 HTML5 视频插件：

https://github.com/jaeger25/Html5Video

在 iOS 上，该标签适用于本地文件。但链接必须是绝对的。

如果您重新编译或重新安装应用程序，链接将会改变。 文件将可用，但 APP ID 已更改，绝对路径也已更改。

iOS 路径示例：

/var/mobile/Applications/<application UUID>/Documents/path/to/file

希望你解决了你的问题。

Answer 2

解决方案成立！！

在几乎所有的 android 和 iOS 示例中，下载的内容都是从 "cordova.file.documentsDirectory" 执行的。

然后，当您在或（通过使用 AJAX）中链接此内容时，一切正常（CSS、图像、链接），但媒体标签（和）。

同样，我不知道为什么，但几乎所有示例都使用此路径下载和解压缩内容。

在被这个问题阻止了几天之后（我发现很多论坛的开发人员必须使用 Cordova Media、jaeger25 Html5Video 等插件修改他们的所有项目），我尝试使用以下路径：“cordova.file.dataDirectory”

我从该路径下载、解压缩并执行 HTML，一切正常，无需解析/修改 HTML 文件（在我的例子中是数千个）。 与 IFRAME 中的相对源路径和标签具有 100% 的兼容性！！！！！！