我有Angular应用程序,它是与node/Express服务器一起构建和服务的。
我使用用户可以观看的视频
<video width="100%" height="344" controls controlsList="nodownload" preload="metadata" autoplay>
<source src="/assets/video/digital.mp4" type="video/mp4">
</video>
它工作正常 . 但在慢速互联网上,它播放得很慢。我想知道在这里可以做什么,这样用户即使在慢速互联网上也不会感到沮丧。
而不是 preload="metadata" 尝试 preload:"auto"
自动:表示可以下载整个视频文件,即使 用户不应使用它。
但正如建议的那样,预加载属性并不总是可靠的。
本博客中提到了4种解决方案,最可靠的是
解决方案#4,ajax和bloburl(有效)
var req = new XMLHttpRequest();
req.open('GET', 'video.mp4', true);
req.responseType = 'blob';
req.onload = function() {
// Onload is triggered even on 404
// so we need to check the status code
if (this.status === 200) {
var videoBlob = this.response;
var vid = URL.createObjectURL(videoBlob); // IE10+
// Video is now downloaded
// and we can set it as source on the video element
video.src = vid;
}
}
req.onerror = function() {
// Error
}
req.send();