最近在项目中需要用video标签查看视频,但是在实际操作过程中遇到了N多的坑,苦不堪言。闲话不多少,直奔主题。
实际上不管是什么浏览器,在使用video标签的时候使用的都是断点续传的操作,所以这个时候我们就要看你的接口是否支持断点续传。而断点续传的关键就是在请求头里面是有一个"Range"的参数,其所携带的值就是要返回的内容区间
来看看关键:
如果要传输视频,必须要解析"Range"字段,然后安装range字段的要求返回对应的数据。同时,在响应头里面则必须有"Content-Range","Content-Length","Content-Range"这三个字段。
Content-Range:必须明确指定视频的格式。有"video/mp4","video/ogg","video/mov"等等,网上都可以搜索的到。
Content-Length:指定返回的二进制长度,这个字段在Chrome上可以不写,会自动添加上,不过不建议这样做。保险起见就是不管是什么浏览器都手动给添加上,确保万无一失。
Content-Range:格式是"bytes start-end/total",其中,start和end必须对应请求头内的"Range"字段,total则是整个文件的大小,不是返回数据的长度,这点不要搞混了。
实际应用时的几个坑:
1、Chrome在第一次请求的时候是没有Range字段的,所以这个时候什么都不需要操