angular 来自节点的 $sce trustAsResourceUrl

Question

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

为此，我已经下载并安装了 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);
    });

然后通过管道传输文件的输出。

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

Answer 1

要将文件作为文件提供，您需要在管道

之前设置适当的headers

要加载文件，您需要将此代码放入您的路由器，以及您使用 post 的位置，如果您没有充分的理由，我会使用 get 或 all

如果客户端决定断开连接，您可能还希望能够结束传输 mid-stream

或者，您可能希望使用 res.download 而不是流，这种情况适用 headers 并且会自动处理中断。

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

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"} ]

Answer 2

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

您可以添加路径前缀“/videos”以区别于常规资源。

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

然后视频文件 ./videos/myvid.mp4 将可用 http://localhost:8000/videos/myvid.mp4

angular 来自节点的 $sce trustAsResourceUrl

angular $sce trustAsResourceUrl from node

node.js

angularjs

videogular