Cordova iOS视频标签本地文件源

hyp*_*erN 6 video html5-video ios cordova phonegap-build

我在基于Cordova的应用程序上在iOS上播放本地视频时遇到问题.一开始我想强调,只有当我使用WKWebView时才会出现这个问题,如果使用UiWebView,视频播放就可以了.这是我的情景:

- 用户进入屏幕传递视频网址

-Via FileTransfer我将其下载到手机并将其存储在所需位置

- 使用JS视频加载<video>标记和播放.

基本上我正在回答这个问题所描述的一切.UiWebView的问题是,如果相对路径设置为src,由于某种原因无法加载视频(无论我使用哪种组合),所以这个解决方案对我很有用,因为它基于这行代码:

entry.toURL()
Run Code Online (Sandbox Code Playgroud)

这将返回下载视频的完整路径,这很好,至少对于UiWebView.

WkWebView的问题是entry.toURL()返回smth.像这样:

file:///var/mobile/Containers/Data/Application/3A43AFB5-BEF6-4A0C-BBDB-FC7D2D98BEE9/Documents/videos/Dips.mp4
Run Code Online (Sandbox Code Playgroud)

并且WKWebView不适用于file://协议.此外,WKWebView都不适用于相对路径:(

任何人都可以帮我解决这个问题吗?

Tae*_*Joe 1

我今天通过以下命令实现了此功能,但仅在以发布模式部署到我的设备时才有效。当以调试模式将应用程序部署到我的设备时,它将无法工作。

  • iOS 9.3.2
  • 科尔多瓦 4.0.0(iOS 3.8.0)
  • Telerik WKWebView Polyfill 0.6.9

视频列表加载方法:

var path = window.cordova.file.documentsDirectory, //iTunes File Sharing directory
    href = 'http://localhost:12344/Documents', //WKWebView default server url to documents
    list = [];
function fsSuccess(dir) {
    var reader = dir.createReader();
    reader.readEntries(function (entries) {
        for (var i = 0; i < entries.length; i++) {
            list.push({ name: entries[i].name, path: href + entries[i].fullPath });
        }
    });
}
function fsError(error) {
    console.log('error', error)
}
window.resolveLocalFileSystemURL(path, fsSuccess, fsError);
Run Code Online (Sandbox Code Playgroud)

视频列表点击处理程序:

var video = $('#video')[0],
    source = $('#source');
function play(index) {
    source.attr('src', list[index].path);
    video.load();
    video.play();
}
Run Code Online (Sandbox Code Playgroud)

视频播放器标记:

<video id="video" autoplay controls loop webkit-playsinline>
    <source id="source" type="video/mp4" />
</video>
Run Code Online (Sandbox Code Playgroud)

在调试时,我像 La Ren Hoek 一样用头撞桌子,直到我尝试发布版本并且它起作用了。