视频不再与Chrome中的mediaelement.js一起流式传输

Question

在过去几天，我们注意到我们的视频使用MediaElement.js Version 2.11.3和Chrome Version 50.0.2661.94 (64-bit)

退出了流媒体

视频仍然在Firefox和Safari中播放没有问题。

我们在Chrome开发工具中收到的错误是：

Uncaught (in promise) DOMException: The element has no supported sources.

呈现页面上的标记如下所示：

<video height="150" poster="https://xxxxxxxxxx.cloudfront.net/123423_1_thumb.jpg" preload="auto" width="200" src="" hidden-source="https://xxxxxxx.cloudfront.net/123423_1_wm.webm">
  <object data="flashmediaelement.swf" height="150" type="application/x-shockwave-flash" width="200">
  <param name="movie" value="flashmediaelement.swf">
  <param name="flashvars" value="controls=true&amp;file=http://s38zby1czkz3d7.cloudfront.net/123423_1_wm.mp4">
  </object>
</video>

以下是一些错误图片，使其更加清晰：

以下是控制台中的错误消息：

Answer 1

我可以用Chromium 51复制这个问题。 但是，Chrome 53似乎不再出现此问题。

不幸的是，我无法在互联网上找到易于阅读的确认信息，这是已确认的Chromium / Chrome确认错误，但只是有迹象表明有几个人报告了Chrome / Chromium版本的问题。例如这里 Videos no longer streaming with mediaelement.js in Chrome 谷歌Chrome开发人员cwilso指向这个内部铬邮件列表，但其内容相当神秘，没有进一步的研究。它似乎与一个名为ENABLE_BROWSER_CDMS的交换机和DRM支持的EME实现有关，但它没有按预期工作。 https://groups.google.com/a/chromium.org/forum/#!topic/chromium-reviews/Qi4dLcKjcCM

Answer 2

这是因为自Chrome 50以来，对<video>或<audio>元素的play（）调用会返回Promise。如果播放成功，则实现Promise，如果播放失败，则拒绝Promise以及解释失败的错误消息。

您可以在此处找到一些示例和更多信息：https://developers.google.com/web/updates/2016/03/play-returns-promise?hl=en

Answer 3

它也可能是一个CORS问题。设置media.crossOrigin = 'anonymous';并确保服务器响应具有标头Access-Control-Allow-Origin: *。或者，而不是星号通配符，指定允许从服务器访问视频的网站的域。