如何快速播放Azure存储大视频并解决Chrome端seekbar无法使用问题

问题1：网页端视频加载速度过慢优化方案 #

• 存储侧配置优化：将存放视频的Azure Blob存储访问层设置为热访问层，降低高频访问资源的响应延迟。如果面向多区域用户，可搭配Azure CDN绑定Blob存储端点，针对.mp4后缀的视频资源配置长缓存规则，减少回源请求占比，大幅提升加载速度。
• 视频资源预处理：避免直接上传未处理的2GB以上原片，先对视频做转码优化，采用H.264/H.265编码在保证画质的前提下降低文件体积；也可将大视频切片为HLS/DASH分片流，实现按需加载分片，无需等待完整文件下载即可启动播放。同时需将视频的moov元数据原子块移到文件头部，让播放器无需下载完整文件即可读取视频编码、时长等核心信息，快速启播。
• 播放器配置优化：给现有<video>标签添加preload="metadata"属性，避免默认加载过多无效内容；也可在页面头部添加Azure存储域名的预连接规则，减少请求时的DNS、TCP握手耗时。

问题2：Chrome浏览器进度条无法跳转修复方案 #

该问题是Chrome对范围请求的校验规则比IE/Edge更严格导致的，可按以下步骤排查修复：

• 确认Azure存储范围请求支持：检查存放视频的Blob存储配置，确保已开启部分Blob访问（新版存储账户默认开启），能够正常响应206 Partial Content状态码。Chrome需要通过范围请求拉取指定时间点对应的视频片段，才能实现进度条跳转。
• 修复视频元数据：将视频的moov元数据移动到文件头部，绝大多数压制工具默认会将moov块放在文件尾部，Chrome无法读取到完整元数据就无法计算时间点对应的字节偏移，导致无法seek。可使用ffmpeg工具快速处理，命令为：

  ffmpeg -i 原视频.mp4 -c copy -movflags faststart 输出视频.mp4
  

• 权限与跨域配置排查：如果使用SAS令牌访问Blob，确认SAS权限包含读取权限，没有限制Range请求头；同时检查Azure存储的CORS配置，确保Range头在允许的请求头列表中，避免跨域规则拦截关键请求头。

内容的提问来源于stack exchange，提问作者鄭有維