admin 管理员组

文章数量: 1184232

本文主要介绍 Web 端视频播放的几类常见问题及相应解决方案。

文章目录

    • 视频播放失败
      • 网络
        • 跨协议拦截
        • CDN 无视频
        • CDN 鉴权失败
        • 微信浏览器拦截
      • 跨域问题
      • 视频未转码
      • 异常视频
      • 浏览器环境不支持播放
        • 浏览器不支持 Flash
        • 浏览器不支持 MSE
        • 浏览器不支持解码 H264 或者不支持播放 MP4、HLS 格式的视频
      • HLS 加密视频播放失败
        • 获取 key 失败
        • 解密失败
    • 浏览器劫持视频播放
      • 视频激活播放后强制全屏
      • 视频无法被其他元素覆盖
      • 播放器出现多余的图标
      • 播放器出现广告、下载、推荐视频等内容
      • Android 端播放视频不会随着页面滑动
    • 播放器显示尺寸
      • 播放器出现黑边
      • 推流端切换横竖屏,播放端不切换
    • 全屏相关问题
      • 默认全屏播放
      • 在 iOS Hybrid App 的 WebView 中默认全屏播放
      • 在 iframe 里使用播放器不能全屏
      • 在 IE8、9、10 浏览器中无法全屏
    • 拖拽、时移播放失败
    • 自动播放相关问题
      • 自动播放失败
      • 在 Hybrid App 的 WebView 中自动播放失败
    • 其他问题
      • 播放器初始化后看不到视频画面
      • 播放器没有变速播放按钮或者变速功能不可用

视频播放失败

视频播放失败有多种原因,定位问题的基本思路是:

  1. 配置网络抓包,查看网络请求情况。
  2. 查看浏览器控制台报错情况。
  3. 检查视频格式,使用的浏览器是否支持播放。

以下是视频播放失败的几种原因,以及对应的解决方案:

网络

跨协议拦截

问题表现: 在 HTTPS 协议的页面播放 HTTP 协议的视频时,浏览器会处于安全考虑进行拦截。
解决方案: HTTP 协议的页面播放 HTTP 的视频,HTTPS 协议的页面播放 HTTPS 的视频。

CDN 无视频

问题表现: 访问视频地址返回404。
解决方案: 定位并修复 CDN 资源。

CDN 鉴权失败

问题表现: 访问视频地址返回403,无法加载视频。
解决方案: 需确认是否开启 referer 防盗链或者 key 防盗链,视频播放时是否具备校验参数。

微信浏览器拦截

问题表现: 在微信无法播放视频,非微信情况下可以播放。
解决方案: 需要通过微信申诉解除拦截。

跨域问题

问题表现: 在 PC 端无法播放视频,浏览器控制台报跨域相关的错误。
问题背景: 在 PC 端使用 Flash 播放视频需要检查视频服务器的crossdomain.xml文件。

crossdomain.xml 的作用

  • 位于www.a域中的 SWF 文件要访问www.b的文件时,SWF 首先会检查www.b服务器根目录下是否有crossdomain.xml文件,如果没有,则访问不成功;如果crossdomain.xml文件存在,且文件内设置了允许www.a域访问,则通信正常。
  • crossdomain.xml中配置的是 SWF 文件的域名。

在 PC 端的现代浏览器使用 HTML5 播放 HLS 和 FLV 时,视频服务器需要配置跨域资源共享 CORS。
正常情况下,腾讯云服务会自动配置这两项跨域策略,如遇到异常情况请 联系我们。

解决方案: 视频存储服务器需要部署crossdomain.xml文件并配置正确的访问策略,以及开启 CORS 支持。

视频未转码

问题表现: 在腾讯云控制台上传视频后,播放器提示视频未转码。
解决方案: 对视频进行转码操作,具体操作请参见 处理视频,确保视频编码格式为 H.264,视频封装格式为 MP4 或者 HLS。

异常视频

问题表现: 转码后的视频出现花屏、黑屏、卡顿和无法播放等现象,可能是原始视频有问题或者视频转码失败。
解决方案: 需要定位原始视频是否有问题,如果是转码问题请 联系我们。

浏览器环境不支持播放

通常情况下在 Web 端播放视频依赖浏览器自带的解码器,或者 Flash 解码器,不支持播放会出现 error code 为3或4的错误。浏览器不支持播放的常见问题如下:

浏览器不支持 Flash

<

本文标签: 常见问题 视频播放 解决方案 WEB