【问题标题】:angular $sce trustAsResourceUrl from node来自节点的角度 $sce trustAsResourceUrl
【发布时间】:2015-06-01 11:44:08
【问题描述】:

我正在尝试制作流媒体服务,将文件(在本例中为视频)的内容流式传输到视频元素中。

为此,我已经下载并安装了videogular,现在正在尝试设置它,但我知道该怎么做。

根据有关 videogular 的文档来加载视频,您需要这样的语法:

sources: [
    {src: $sce.trustAsResourceUrl(myMp4Resource), type: "video/mp4"}
]

当您想在不流式传输的情况下加载内容时,这很好。

但是假设您有一个节点服务器在端口 8105 上运行,并且您希望收集的文件的 id 为 1,那么结果可能如下所示:

sources: [
    {src: $sce.trustAsResourceUrl('http://localhost:8105/loadvideo/1'), type: "video/mp4"}
]

但是,在我尝试这样做时,它只会告诉我该资源不是实际资源。

我的问题是您如何流式传输到视频内容(最好使用 videogular),有没有人知道人们使这成为可能的示例?

服务器端代码

好的,所以我最初的想法(我知道这是对上面代码的更改)是创建一个route,它采用路径:

    router.route('/retrieveFile')
    .post(function (request, response) {
        var path = '../' + request.body.data;
        var file = fs.createReadStream(path);
        file.pipe(response);
    });

然后通过管道输出文件。

然后使用它来流式传输文件

【问题讨论】:

  • 将您的浏览器指向localhost:8105/loadvideo/1实际上会下载视频?
  • @laggingreflex 作为一个例子,它应该收集视频并流式传输,但我不太确定从这里去哪里,或者如果我做得正确,我似乎找不到任何例子,所以我有点把东西扔进黑暗中
  • 你能不能创建一个简单的小提琴,这样我们就可以解决这个问题,看看会发生什么。因为,这种方式效果很好。
  • 我添加了一些服务器端代码,请注意,我不确定它是否会以这种方式工作,所以欢迎更好的想法

标签: angularjs node.js videogular


【解决方案1】:

如果您的硬盘驱动器上有视频文件,并且您想使用它们的文件名来提供它们,您应该只使用Express Static 来提供它们,就像任何其他资源一样

您可以添加路径前缀“/videos”以将它们与常规资源区分开来。

app.use('/videos', express.static('videos'));

然后视频文件./videos/myvid.mp4 将作为http://localhost:8000/videos/myvid.mp4 提供

【讨论】:

    【解决方案2】:

    要将文件作为文件提供,您需要在管道之前设置适当的标题

    要加载文件,您需要将此代码放在路由器中,以及您使用post 的位置,如果您没有充分的理由,我会使用getall

    如果客户端决定在中途断开连接,您可能还希望能够结束传输

    或者,您可能希望使用res.download 而不是流,这样会自动处理相应的标头和中断。

    所以整个代码可能如下所示:

    router.route('/path/to/video.mp4')
    .all(function(req, res){
        res.header('content-disposition', 'filename="video.mp4"')
        var stream = fs.createReadStream('./resources/video.mp4');
        stream.pipe(res);
        require('on-finished')(res, stream.abort.bind(stream));
    
        // or simply
        res.download(fs.readSync('/path'))
    });
    

    然后您可以使用http://localhost:8000/path/to/video.mp4 将视频直接加载到您的浏览器中,如果可以播放它就会播放,或者只是提供下载。或者您可以在 videgular 中使用此 URL

    sources: [ {src: $sce.trustAsResourceUrl('http://localhost:8000/path/to/video.mp4'), type: "video/mp4"} ]
    

    【讨论】:

    • 非常感谢您的回答。你能告诉我如何从前端加载文件(以我为例,你将如何调用流)?
    • 看起来不错,但我如何确保调用节点服务器?假设节点服务器在端口 8105 上运行,那么在尝试查找源时不会请求它,因为默认端口是 80?
    • 我知道我可能很愚蠢,但是 url 的路径会触发路由('/retrieveFile'),例如我的文件路径是“user_resources/module/5/video.mp4”?跨度>
    • @MarcRasmussen 是实际文件在您的机器上的路径,还是您希望提供视频文件的 URL 路径?如果是前一种情况,请在您的fs.readStream(path) 中替换该路径,但如果是后一种情况,请在您的路由器.router('user_resources/module/5/video.mp4').all(function) 中替换它(实际上我刚刚意识到我在该代码中犯了一个错误,请参阅更正)
    • 如果是前者,这是否意味着我必须为上传到我系统的每个文件创建一个新路由,如果我想提供它?
    猜你喜欢
    • 2016-11-07
    • 1970-01-01
    • 2015-08-24
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-09-04
    • 2017-08-24
    • 2016-10-05
    相关资源
    最近更新 更多