html视频播放器并不总是从src读取

Question

我想从我的网络服务器播放视频文件。这是我的HTML代码。

<video width="100%" height="100%" controls>
    <source ng-src="{{media_url}}" type="video/mp4" />
</video>
<div>{{media_url}}</div>

在角度控制器中：

$scope.media_url = '/get_video/movie.mp4';

每次刷新页面时，div都会正确显示。但是，视频播放器并不总是向＆＃34; /get_video/movie.mp4"发送请求。它的行为看起来是随机的。

如果我直接设置了src，那就没问题了：

<source ng-src="/get_video/movie.mp4" type="video/mp4" />

知道为什么吗？

Answer 1

浏览器基于URL进行缓存，我相信每次你应该生成可以解决问题的新网址，并且不会影响你的功能。在url末尾添加日期会使url每次都是唯一的，因为它不会从浏览器缓存查找中检索任何内容。

<强>标记

<video width="100%" height="100%" controls>
    <source ng-src="{{generateNewUrl(media_url)}}" type="video/mp4" />
</video>

<强>代码

$scope.generateNewUrl = function(media_url){
    return media_url + "?t="+new Date();
}

Answer 2

我实际上发现了这个问题。这不是因为浏览器缓存。

参考这篇文章

changing source on html5 video tag