我在Android设备上的iPad和Google Chrome浏览器的Safari中流式传输视频时遇到问题。该应用程序在我使用Microsoft Edge Chromium浏览器的笔记本电脑上运行良好。我已经找了一些例子来解决我的问题，但我找不到任何具体的例子。问题是客户端将发送获取请求来检索视频文件。我使用gridfs stream从MongoDb数据库中检索该文件，然后通过管道将该文件发送到响应对象。这允许用户在视频js播放器中查看视频流。这在使用Microsoft Edge Chromium浏览器的笔记本电脑和桌面设备上没有问题，但在Safari和Mobile Chrome浏览器中失败了。这是我的代码：
我响应请求并从数据库中检索文件，然后通过管道将其发送到节点中的响应对象：
app.get('/get-video', (req, res, next) => {
let video = req.query.video;
gfs.files.findOne({ filename: video }, (err, file) => {
// Check if file ex
if (!file || file.length === 0) {
return res.status(404).json({
err: 'No file exists'
});
}
else {
let readstream = gfs.createReadStream(file.filename);
readstream.pipe(res);
}
});
});
正如您所说，我在get请求中根据视频名称找到文件，创建ReadStream，并将文件流式传输到响应对象。以下是从客户端发出get请求的html代码。播放器正在使用视频js库，但我找不到创建流的任何兼容性问题，这在Edge/Chromium浏览器中确实有效：
<video class="video-js vjs-big-play-centered vjs-16-9 card-img-top" autopreload="false" data-setup='{"autoplay": false, "controls": true}'>
<source src="/get-video?video=<%= post.source %>">
</video>
我正在制作视频的来源，即从get请求发送的响应，即视频流。在Safari浏览器中，我收到错误：由于损坏问题或由于您的浏览器不支持媒体使用的功能，媒体播放被中止
当通过get请求发送图像时，我在任何浏览器中都没有这个问题。当我只是请求静态文件时，我也没有任何问题。当我尝试发送视频流时，这个问题似乎包含在特定的浏览器中。
我之所以使用流而不是静态文件，是因为我在云中托管应用程序。我必须从MongoDb数据库发送原始文件(或者至少这是我的理解(。当我在将应用程序发送到云之前测试它时，这个问题没有发生，因为我可以简单地使用文件系统并将文件路径存储为视频的源。然而，Heroku应用程序的文件系统并不持久，所以在这种情况下我使用云数据库。现在我需要从数据库中对其进行流式传输，问题就出现了。
使用自定义iframe概念
<!DOCTYPE html>
<html>
<body>
<h1>The iframe element</h1>
<iframe src="https://www.w3schools.com">
<p>Your browser does not support iframes.</p>
</iframe>
</body>
</html>要在网页上播放视频，请执行以下操作：
将视频上传到YouTube记下视频id在网页中定义元素让src属性指向视频URL使用宽度和高度属性来指定玩家的尺寸将任何其他参数添加到URL(见下文(
<!DOCTYPE html>
<html>
<body>
<iframe width="420" height="345" src="https://www.youtube.com/embed/tgbNymZ7vqY">
</iframe>
</body>
</html>