美文网首页
HTML5 媒体源扩展API(Media Source Exte

HTML5 媒体源扩展API(Media Source Exte

作者: ShinyBoy_404c | 来源:发表于2017-09-12 23:45 被阅读0次

在HTML4中,浏览器并没有实现对多媒体文件的播放,于是Flash应运而生,给浏览器实现事动画、视频、音频等的播放,于是Flash红级一时。

HTML5的到来,带来了浏览器卫生对动画、视频、音频的支持,导致了Flash的淘汰。

在HTML5中,如果我们需要对一个视频文件播放,我们仅仅只需要简单实用以下代码:

<video src='xxxx'  controls="controls"></video>

在上面这段代码中,我们只简单写了一个标签,就可以实现视频的播放,但是这段带码有很强的限制,video支持的文件格式是很有限的


格式                        IE                    Firefox                     Opera                      Chrome                       Safari


Ogg                                No                              3.5+                               10.5+                                  5.0+                                     No

MPEG                            49.0+                          No                                  No                                      5.0+                                     3.0+

WebM                              No                             4.0+                                10.6+                                  6.0+                                      No


从上表中我们可以看到Video标签支持的文件格式是由限制的,那么我们先支持一些其他文件格式,有什么办法呢?

这个办法就是我们今天的主题,Media Source Extensions  媒体源扩展(以下简称MSE),顾明思议,这个API就是用于扩展文件格式的。

MSE扩展了HTMLMediaElement,允许JavaScript生成媒体流以支持回放。这可以用于自适应流(adaptive streaming)及随时间变化的视频直播流(live streaming)等应用场景。

通过自适应流我们可以实现FLV等格式的文件办法。

在MSE主要有一个类MediaSource。

MediaSource是MSE表示媒体资源HTMLMediaElement对象的接口。MediaSource对象可以附着在HTMLMediaElement在客户端进行播放。

相关文章

  • HTML5 媒体源扩展API(Media Source Exte

    在HTML4中,浏览器并没有实现对多媒体文件的播放,于是Flash应运而生,给浏览器实现事动画、视频、音频等的播放...

  • 关于API

    DOM扩展 对DOM的两个主要的扩展是Selectors API (选择符 API) 和HTML5。这两个扩展都源...

  • DOM扩展

    DOM扩展 Selectors API和HTML5 Selctor API querySelector() que...

  • 11 DOM 扩展

    本章内容 理解 Selectors API 使用 HTML5 DOM 扩展 了解专有的 DOM 扩展 对 DOM ...

  • H5直播系列二 MSE(Media Source Extensi

    参考w3c media-sourceMedia Source 系列 - 使用 Media Source Exten...

  • DOM扩展

    本章内容:介绍Selectors API、HTML5 DOM扩展、了解专有的DOM扩展 对DOM的主要扩展是 Se...

  • Flink的API

    Source API 以下scala代码展示了几种source类型: flink从kafka获取源数据 首先pow...

  • 十七

    DOM扩展对DOM的两个主要的扩展是Selectors API(选择符API)和HTML5。 选择符APISele...

  • 22-SparkSQL03

    External Data Source API 外部数据源 MapReduce Hive Spark 加载数据 ...

  • 第11章DOM扩展

    对DOM 的两个主要的扩展是Selectors API(选择符API)和HTML5。这两个扩展都源自开发社区,而将...

网友评论

      本文标题:HTML5 媒体源扩展API(Media Source Exte

      本文链接:https://www.haomeiwen.com/subject/tjwhsxtx.html