Javascript HTML5视频播放器使用模拟器工作，但不在实际设备上

好的，在过去的几天里，我一直在尝试在angular应用程序上实现视频

以下是视频it自身的一些事实：

• 所有视频都是MP4文件
• 视频正在使用node js进行流式传输
• 使用google chrome设备模拟器测试此im

现在转到实际代码：

首先，在我的

node.js

应用程序中，我有以下用于获取视频的代码：

router.route('/resource/:encodedString')
    .all(function (req, res) {
        var decoded = jwt.decode(req.params.encodedString, require('../secret')());
        var mediaObject = decoded.mediaObject;

        if (mediaObject.file.extension == 'pdf') {
            res.set('Content-Type', 'application/pdf');
        } else {
            res.set('Content-Type', 'application/octet-stream');
        }
        res.header('mimetype', mediaObject.file.mimetype);
        res.header('content-disposition', 'filename=' + mediaObject.file.originalname);


        // res.header('content-disposition', 'filename=' + mediaObject.file.originalname);
        var stream = fs.createReadStream(mediaObject.targetDir + mediaObject.file.originalname);
        stream.pipe(res);
        stream.on('end', function () {
            console.log("Reading operation completed.");
            res.end();
        });
    });

基本上，

encodedString

变量包含一个包含所有文件信息的对象

然后在我的HTML中，我有以下内容：

    <video width="459" height="320" controls>
    <source src="{{LRM.getResourceUrl(resourceToken,null) | trustUrl}}" type="video/mp4">
    Your browser does not support the video tag.
</video>

现在，当我在我的桌面上运行时，我得到了电影，没有问题

然后，当我使用emulator运行它并模拟iPhone5或ipad时，它也可以正常工作

但是，当我使用手机（实际设备）时，视频不会播放，它只显示“视频播放”按钮

---

有谁能告诉我是什么原因造成的吗？

我想你只在iOS设备上看到了这个问题？如果是这样，这可能是一个已知的问题，因为iOS中的浏览器没有在经过身份验证的链接后播放视频。有关苹果论坛的最新视图，请参见下面的链接，尤其是这篇摘自其中一篇文章的最佳摘要（IMHO）：

在iOS 8中，苹果在Safari中引入了一个问题，即无法播放HTTP基本身份验证后存储的媒体文件。浏览器内媒体播放器似乎不共享浏览器的已验证会话。这对我来说是个问题，因为我总是在iPhone上使用Safari在我的服务器上播放音乐。由于Safari不在iOS 8中工作，我尝试了Chrome和Opera，但它们似乎共享Safari web视图和行为。Atomic没有身份验证问题，但有一个单独的问题，即播放媒体时没有声音。我尝试过的唯一两种浏览器对我有效的是Mercury和Dolphin。现在，这些是我在服务器上播放音乐的最佳选择。”

    app.factory('LRM', function () {
    var LRM = {};
    $.getJSON("config.json", function (json) {
        LRM.env = json.app_url; // this will show the info it in firebug console
    });

    LRM.getResourceUrl = function (resourceString, type) {
        if (resourceString.indexOf('/') >= 0) {
            //Legacy method
            return resourceString;
        }
        else {
            if(type == null){
                return LRM.env + '/resource/' + resourceString;
            }
            else
            {
                return LRM.env+'/resource/'+resourceString+'/'+type;
            }
        }
    };

    LRM.getDeviceResource = function (resourceString, os) {
        if (resourceString.indexOf('/') >= 0) {
            //Legacy method
            return resourceString;
        }
        else {
            if(os == null){
                return LRM.env + '/deviceResource/' + resourceString;
            }
            else
            {
                return LRM.env+'/deviceResource/'+resourceString+'/'+os;
            }
        }
    };

    LRM.getUploadUrl = function (method) {
        if(LRM.env){
            return LRM.env + method;
        }
    };

    return LRM;

});