Chrome中不再使用mediaelement.js进行流式传输 [英] Videos no longer streaming with mediaelement.js in Chrome

问题描述

在过去的几天中，我们注意到我们的视频使用 MediaElement.js版本2.11.3 和 Chrome版本50.0.2661.94（ 64位）

在Firefox和Safari中播放视频毫无问题。

<我们在Chrome Dev Tools中收到的错误是：
$ b

未捕获（在诺言中）DOMException：该元素没有支持的源。

code>

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

 < video height =150poster =https://xxxxxxxxxx.cloudfront.net/123423_1_thumb.jpgpreload =autowidth =200src =hidden-source =https： //xxxxxxx.cloudfront.net/123423_1_wm.webm\"> 
< object data =flashmediaelement.swfheight =150type =application / x-shockwave-flashwidth =200> 
< param name =movievalue =flashmediaelement.swf> 
< param name =flashvarsvalue =controls = true& amp; amp; amp; file = http：//s38zby1czkz3d7.cloudfront.net/123423_1_wm.mp4> 
< / object> 
< / video> 
  

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

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

Over the past few days, we noticed that our videos quit streaming using MediaElement.js Version 2.11.3 and Chrome Version 50.0.2661.94 (64-bit)

Videos still play in Firefox and Safari without a problem.

The error we receive in the Chrome Dev Tools is:

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

The markup on the rendered page looks like this:

<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>

Here are some images of the errors to make it a little more clear:

Here are the error messages in the console:

解决方案

That is because since Chrome 50 a play() call on a <video> or an <audio> element returns a Promise. If playback succeeds, the Promise is fulfilled, and if playback fails, the Promise is rejected along with an error message explaining the failure.

You can find some examples and more information here: https://developers.google.com/web/updates/2016/03/play-returns-promise?hl=en

这篇关于Chrome中不再使用mediaelement.js进行流式传输的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！