博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
safari下video标签无法播放视频的问题
阅读量:6293 次
发布时间:2019-06-22

本文共 551 字,大约阅读时间需要 1 分钟。

因为前段时间有个需求,需要展示下操作视频,当时没多想,直接将视频放到了静态文件目录里面,写了个video标签,通过下面代码直接引入。

复制代码

?,当时看了下Chrome,没什么问题,上线 。

后来有使用者反馈,在safari中无法播放视频。想搜索下原因,没有找到。。当时还被这个网站误导了(这个网站无法播放,应该是因为视频格式的原因)。

中间有很多测试不表,接下来来说说原因和解决方案

对比下正常可以播放的视频,发现会发送两个视频请求(这地方让我想到了跨域时候,对于非简单请求,会先发送一个option请求)

仔细看了下请求参数,发现safari会先发送一个请求头Range: bytes=0-1,这个请求头说明他不请求内容,只是请求一个字节,如果这个请求返回的内容和Safari所需要的内容不符,就不会继续请求了。

测试了下,发现就是这个问题,因为我的服务端没能支持range请求头导致的。

解决方案就很简单了,因为我的服务端是使用node+Koa搭建的,找了一个koa-range的包引入就好了。

其他语言的服务端解决方案也很好搜索,这里面就不写了。

解决之后我还搜索到一篇别人的文章  

转载于:https://juejin.im/post/5b4f4bc7e51d4519185331dd

你可能感兴趣的文章
写给0-3岁产品经理的12封信(第08篇)——产品运营能力
查看>>
ArcGIS Engine 符号自动化配置工具实现
查看>>
小程序 · 跳转带参数写法,兼容url的出错
查看>>
flutter error
查看>>
Flask框架从入门到精通之模型数据库配置(十一)
查看>>
10年重新出发
查看>>
2019年-年终总结
查看>>
聊聊elasticsearch的RoutingService
查看>>
让人抓头的Java并发(一) 轻松认识多线程
查看>>
从源码剖析useState的执行过程
查看>>
地包天如何矫正?
查看>>
中间件
查看>>
Android SharedPreferences
查看>>
css面试题
查看>>
Vue组建通信
查看>>
用CSS画一个带阴影的三角形
查看>>
前端Vue:函数式组件
查看>>
程鑫峰:1.26特朗.普力挺美元力挽狂澜,伦敦金行情分析
查看>>
safari下video标签无法播放视频的问题
查看>>
01 iOS中UISearchBar 如何更改背景颜色,如何去掉两条黑线
查看>>