近期在做一个pc webview的项目,用的是熟悉的flask+pywebview, 涉及到本地视频文件在前端页面上播放,最开始尝试直接打开文件,然后返回read的值,发现前端无法拖动进度条,查阅之后,才知道需要传输视频流,条件是:
- 前端请求头携带 Range, 其值表示视频文件的读取起点
- 后端需要在响应头中添加Content-Length,Content-Range,Accept-Range
- 状态码需返回206
具体配置如下,至于原因,不详,自己猜出来的。
大概就是通过移动文件的指针来指定开始读取的地方,并通过Content-Range作为一个文件进度标识,这样浏览器就可以识别返回的数据具体是那个时间间隔的视频段,不需要按顺序加载完再播放了。
@app.route('/')
def test():
filename = 'test2.mp4'
fileSize = os.path.getsize(filename)
f = open(filename,'rb')
f.seek(request.range.ranges[0][0])
headers = {
'Accept-Range':'bytes',
'Content-Length': fileSize,
'Content-Range': request.range.to_content_range_header(fileSize)
}
return Response(f,206,headers,content_type='video/mp4')
|