Safari 无法加载 MP4 视频

Question

最新的 Safari v11.0 无法播放通过 JavaScript 动态设置的 MP4 视频。但这在 Chrome、Edge 和 FF 上运行良好。

我的代码将 src 元素设置为指向 MP4 资源，如下所示：

<video class="replay" autoplay="true" autostart="true" autobuffer="true" playsinline="true" webkit-playsinline="webkit-playsinline" controls="controls" style="" preload="auto" muted="true">
    <source src="https://videomail.io/videomail/11e7-ad5a-4b14b680-a354-934ec5b49c33/preview/type/mp4/x-videomail-site-name/videomail.io/videomail.mp4?1507598907103" type="video/mp4">
</video>

问题是 Safari 在“网络”选项卡下以红色突出显示：

在请求和响应（右侧）下，它说它已被取消。为什么？

加上请求 Headers 我看到：Range bytes=0-1。看起来很奇怪。虽然那个资源我curl了一下，看着不错，可以完整下载

尝试了很多不同的改变，都失败了。不确定这是 nginx 问题、我的 JS 代码中的错误还是 Safari 问题。非常欢迎任何线索。

非常容易重现：

在 Safari 中，转到 www.videomail.io
开始录制视频
点击预览，没有视频出现（在 Chrome 上工作正常）

Answer 1

----最终解决方案----

通过在 express.js 控制器代码中使用以下内容自行修复此问题：

  res.sendFile(file, {
    lastModified: false,
    acceptRanges: true,
    cacheControl: false
  }, function (err) {
    if (err && err.code !== 'ECONNRESET') {
      next(err)
    }
  })

Answer 2

添加 X-pad: avoid browser bug 响应 header 解决了我的问题。

Safari 无法加载 MP4 视频

Safari fails to load MP4 videos

javascript

safari

mp4