2049人阅读
Asp.Net（9）
&& Web页面可能需要播放视频文件，通过添加Object 利用微软的流媒体播放器则可以实现此功能。介绍 Media Player两种版本播放器的嵌入代码，有相关说明(默认0为否,-1或1为是)本代码没有判断浏览器版本的参数
以下是前台代码
&object classid=&clsid:22D6F312-B0F6-11D0-94AB-E95& id=&MediaPlayer1& width=&286& height=&225&&&param name=&AudioStream& value=&-1&&&param name=&AutoSize& value=&-1&&&!--是否自动调整播放大小--&&param name=&AutoStart& value=&-1&&&!--是否自动播放--&&param name=&AnimationAtStart& value=&-1&&&param name=&AllowScan& value=&-1&&&param name=&AllowChangeDisplaySize& value=&-1&&&param name=&AutoRewind& value=&0&&&param name=&Balance& value=&0&&&!--左右声道平衡,最左-9640,最右9640--&&param name=&BaseURL& value&&param name=&BufferingTime& value=&15&&&!--缓冲时间--&&param name=&CaptioningID& value&&param name=&ClickToPlay& value=&-1&&&param name=&CursorType& value=&0&&&param name=&CurrentPosition& value=&0&&&!--当前播放进度 -1 表示不变,0表示开头 单位是秒,比如10表示从第10秒处开始播放,值必须是-1.0或大于等于0--&&param name=&CurrentMarker& value=&0&&&param name=&DefaultFrame& value&&param name=&DisplayBackColor& value=&0&&&param name=&DisplayForeColor& value=&&&&param name=&DisplayMode& value=&0&&&param name=&DisplaySize& value=&0&&&!--视频1-50%, 0-100%, 2-200%,3-全屏 其它的值作0处理,小数则采用四舍五入然后按前的处理--&&param name=&Enabled& value=&-1&&&param name=&EnableContextMenu& value=&-1&&&!-是否用右键弹出菜单控制--&&param name=&EnablePositionControls& value=&-1&&&param name=&EnableFullScreenControls& value=&-1&&&param name=&EnableTracker& value=&-1&&&!--是否允许拉动播放进度条到任意地方播放--&&param name=&Filename& value=&& valuetype=&ref&&&!--播放的文件地址--&&param name=&InvokeURLs& value=&-1&&&param name=&Language& value=&-1&&&param name=&Mute& value=&0&&&!--是否静音--&&param name=&PlayCount& value=&10&&&!--重复播放次数,0为始终重复--&&param name=&PreviewMode& value=&-1&&&param name=&Rate& value=&1&&&!--播放速率控制,1为正常,允许小数--&&param name=&SAMIStyle& value&&!--SAMI样式--&&param name=&SAMILang& value&&!--SAMI语言--&&param name=&SAMIFilename& value&&!--字幕ID--&&param name=&SelectionStart& value=&-1&&&param name=&SelectionEnd& value=&-1&&&param name=&SendOpenStateChangeEvents& value=&-1&&&param name=&SendWarningEvents& value=&-1&&&param name=&SendErrorEvents& value=&-1&&&param name=&SendKeyboardEvents& value=&0&&&param name=&SendMouseClickEvents& value=&0&&&param name=&SendMouseMoveEvents& value=&0&&&param name=&SendPlayStateChangeEvents& value=&-1&&&param name=&ShowCaptioning& value=&0&&&!--是否显示字幕,为一块黑色,下面会有一大块黑色,一般不显示--&&param name=&ShowControls& value=&-1&&&!--是否显示控制,比如播放,停止,暂停--&&param name=&ShowAudioControls& value=&-1&&&!--是否显示音量控制--&&param name=&ShowDisplay& value=&0&&&!--显示节目信息,比如版权等--&&param name=&ShowGotoBar& value=&0&&&!--是否启用上下文菜单--&&param name=&ShowPositionControls& value=&-1&&&!--是否显示往前往后及列表,如果显示一般也都是灰色不可控制--&&param name=&ShowStatusBar& value=&-1&&&!--当前播放信息,显示是否正在播放,及总播放时间和当前播放到的时间--&&param name=&ShowTracker& value=&-1&&&!--是否显示当前播放跟踪条,即当前的播放进度条--&&param name=&TransparentAtStart& value=&-1&&&param name=&VideoBorderWidth& value=&0&&&!--显示部的宽部,如果小于视频宽,则最小为视频宽,或者加大到指定值,并自动加大高度.此改变只改变四周的黑框大小,不改变视频大小--&&param name=&VideoBorderColor& value=&0&&&!--显示黑色框的颜色, 为RGB值,比如ffff00为黄色--&&param name=&VideoBorder3D& value=&0&&&param name=&Volume& value=&0&&&!--音量大小,负值表示是当前音量的减值,值自动会取绝对值,最大为0,最小为-9640--&&param name=&WindowlessVideo& value=&0&&&!--如果是0可以允许全屏,否则只能在窗口中查看--&&/object&
以上适合于老式播放器，新式播放器是在MediaPlayer9.0以后出现的,也就是说只有装了9.0或9.0以上的播放器才能正常使用的.
新式播放器配置相对较为简单些
&object id=&player& height=&64& width=&260& classid=&CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6&&&param NAME=&AutoStart& VALUE=&-1&&&!--是否自动播放--&&param NAME=&Balance& VALUE=&0&&&!--调整左右声道平衡,同上面旧播放器代码--&&param name=&enabled& value=&-1&&&!--播放器是否可人为控制--&&param NAME=&EnableContextMenu& VALUE=&-1&&&!--是否启用上下文菜单--&&param NAME=&url& VALUE=&&&&!--播放的文件地址--&&param NAME=&PlayCount& VALUE=&1&&&!--播放次数控制,为整数--&&param name=&rate& value=&1&&&!--播放速率控制,1为正常,允许小数,1.0-2.0--&&param name=&currentPosition& value=&0&&&!--控件设置:当前位置--&&param name=&currentMarker& value=&0&&&!--控件设置:当前标记--&&param name=&defaultFrame& value=&&&&!--显示默认框架--&&param name=&invokeURLs& value=&0&&&!--脚本命令设置:是否调用URL--&&param name=&baseURL& value=&&&&!--脚本命令设置:被调用的URL--&&param name=&stretchToFit& value=&0&&&!--是否按比例伸展--&&param name=&volume& value=&50&&&!--默认声音大小0%-100%,50则为50%--&&param name=&mute& value=&0&&&!--是否静音--&&param name=&uiMode& value=&mini&&&!--播放器显示模式:Full显示全部;mini最简化;None不显示播放控制,只显示视频窗口;invisible全部不显示--&&param name=&windowlessVideo& value=&0&&&!--如果是0可以允许全屏,否则只能在窗口中查看--&&param name=&fullScreen& value=&0&&&!--开始播放是否自动全屏--&&param name=&enableErrorDialogs& value=&-1&&&!--是否启用错误提示报告--&&param name=&SAMIStyle& value&&!--SAMI样式--&&param name=&SAMILang& value&&!--SAMI语言--&&param name=&SAMIFilename& value&&!--字幕ID--&&/object&
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：27410次
排名：千里之外
原创：17篇
评论：16条
(3)(4)(5)(1)(1)(4)后使用快捷导航没有帐号？
主题帖子积分最后登录&
本帖最后由 gvs5sh 于
18:09 编辑
直播地址购买使用流程说明
视频直播地址功能简介：
视频直播地址，可以轻松让您拥有互联网视频直播的能力，可以把视频嵌入到您的网站或者微信公众号中，让您的微信公众号、网站内容更加丰富。实现生态农业养殖、商铺环境可视化营销、幼儿园宝宝在线实时直播等在线视频应用，打造属于您自己的商业模式。
1.png (18.4 KB, 下载次数: 15)
17:59 上传
STEP1：购买地址1、 登录，打开“开发者服务 / 互联网直播”页面。
2.png (75.35 KB, 下载次数: 13)
17:59 上传
2、 点击“购买”，可打开“服务订购”页面，直播地址有多种套装进行选择，具体方案套餐可参考“价格方案”页面介绍。
3.png (34.3 KB, 下载次数: 20)
14:40 上传
3、 点击“支付”，进入支付页面，用户可选择其中一种方式支付。
5.png (95.71 KB, 下载次数: 21)
17:44 上传
4、用户支付完成后，回到之前的支付页面，点击“已完成付款”，确认支付。
6.png (91.17 KB, 下载次数: 17)
17:44 上传
STEP2：提取地址5、用户确认支付后，浏览器跳转“我的资源”页面，选择需要直播的视频，点击“设置直播“可复制不同清晰度的视频直播地址，不同的清晰度对应不同的码流大小，所消耗的流量也不相同。注：设备需用官方APP添加至萤石开发者账号内并保持设备在线状态。
3.png (60.95 KB, 下载次数: 5)
17:59 上传
4.png (77.48 KB, 下载次数: 6)
18:00 上传
STEP 3：使用地址拿到地址后，可以实现地址的嵌入使用，目前主要应用场景为WEB嵌入与微信公众号H5页面的嵌入方式。萤石也提供了标准的H5页面，方便没有开发经验的第三方合作伙伴，生成已经制作的页面，在“设置直播”的界面中用户可以自定义页面样式、标题、不同时间段的权限控制，复制URL地址链接后使用。
5.png (85.78 KB, 下载次数: 4)
18:00 上传
6.png (38.86 KB, 下载次数: 6)
18:00 上传
1.& && &&&WEB嵌入
如果是web页面应用场景，可以在页面里嵌入flash播放器，引入直播地址即可播放。推荐ckplayer播放器和百度的T5player，示例采用T5player如何嵌入web页面的方式，代码如下：
&div id=&playercontainer&&&/div&&%--创建视频容器--%&
&script type=&text/javascript&
src=&&cyberplayer.min.js的路径&&&&/script&
&script type=&text/javascript&&
var player = cyberplayer(&playercontainer&).setup({
flashplayer: &&cyberplayer.flash.swf的路径&&,
width: 680,
height: 400,
backcolor: &#FFFFFF&,
stretching: &uniform&,
file: &此处填写购买获取到的m3u8地址&,
autoStart: true,
repeat: &always&,
volume: 100,
controlbar: &over&
});
&/script&复制代码说明：
T5player下载地址
下载T5player压缩包后将其中的cyberplayer.min.js和cyberplayer.flash.swf解压后导入到工程中，代码里填写正确的文件路径，服务器环境下就可以访问并播放视频。（代码中其他参数开发者可自行学习文档了解之。）
2.& && &&&微信H5页面嵌入
如果是H5页面应用场景，可以通过video标签播放m3u8Url播放源地址来实现视频的播放，示例代码如下：/* H5-DEMO.html */
&!DOCTYPE html&
&html lang=&en&&
&head&
& & &meta charset=&UTF-8&&
& & &title&移动端页面（H5、微信）Demo&/title&
&/head&
&body&
& & &video src=&此处填写购买获取到的m3u8地址&&&/*此处填写购买获取到的m3u8地址*/
& && && &&&poster=&此处填写封面图片地址&& & /*此处填写封面图片地址*/
& && && &&&controls=&controls& width=&100%& height=&100%&&
& & &/video&
&/body&
&/html&复制代码
同样是服务器环境下，就可以访问并播放视频。
特别说明：针对轻应用类型的开发，目前已经对外开放大量的HTTP的接口，更多详细功能接口请戳
?&&有多个设备是否需要多个地址答：一个视频源对应一个地址?&&浏览路数、流量怎么对应到设备？答：每台设备（通道）只能设置一种计费方式，如果设备包含多通道，每个通道可以单独设置。?&&流量怎么计算？答：流量归属账户，账户下所选设备共享，不清零，云存储上传不计流量。?&&哪些设备可以使用直播视频地址？答：开放平台对接的是平台的视频能力，所以能接入萤石云的设备可以支持直播视频地址的对接开发
主题帖子积分最后登录&
萤石技术支持
本月底会把获取地址的方式直接嵌入到网站上去，自助去获取，届时不需要再发邮件获取，敬请期待！
主题帖子积分最后登录&
主题帖子积分最后登录&
刚试了下，手机端是直接可以打开本地的h5页面的，可以播放
主题帖子积分最后登录&
pc端要看是要浏览器支持HTML5的，求大神指点一二
主题帖子积分最后登录&
骨灰级萤石控, 积分 779, 距离下一级还需 221 积分
骨灰级萤石控
用video标签直接可以在移动端打开，试了几个手机浏览器都可以。
PC端不能用video，用T5Player可以打开，不过不是很好用，经常要刷新两次才能打开。
另外打开视频的时间还是略长，即使做不到360和qq物联那样的秒开，5秒钟以下是用户可以接受的。经常卡到十来秒才开，还是不尽如意，希望萤石越做越好！
人勤天不欺
主题帖子积分最后登录&
用video标签直接可以在移动端打开，试了几个手机浏览器都可以。
PC端不能用video，用T5Player可以打开，不 ...
一看就是大神啊，都不敢说话了-_-
萤石本身是海康私有化的协议（基于RTSP） 优点是取流超级快，但是只是限于海康平台能用，跨平台性不好。同样的HLS协议优点是跨平台性好，但是就牺牲了性能。直播地址我们采用的是HLS协议，协议本身延时就会比普通的流媒体直播协议要高，这方面我们一直在做优化呢。让360和qq提供视频直播地址给第三方，他们也不一定能做到秒开，你觉得呢？
主题帖子积分最后登录&
潜力级萤石控, 积分 9, 距离下一级还需 41 积分
潜力级萤石控
本帖最后由 kid0912 于
10:03 编辑
@xiaofu_1991 一个公司内部监控系统要做成web端, 之前获取m3u8地址只能通过分享到视频广场, 现在是否只要购买直播地址, 不用分享?
主题帖子积分最后登录&
@gvs5sh @xiaofu_1991 一个公司内部监控系统要做成web端, 之前获取m3u8地址只能通过分享到视频广场, 现在是 ...
是的，购买之后我们提供直播地址
主题帖子积分最后登录&
潜力级萤石控, 积分 9, 距离下一级还需 41 积分
潜力级萤石控
是的，购买之后我们提供直播地址
注册天数 ≥ 100
在线时间(小时) ≥ 150
发帖数 ≥ 200
S1资源组微笑天使
为S1专版提供各类优质资源，帮助广大萤火虫一起玩转S1
R1公测特邀嘉宾
R1公测资格用户，见证R1的成长
萤石产品经理
萤石产品经理精英团成员
成功发布一个主题帖
发布10个精华帖
万帖达成纪念章
萤石社区万帖达成贡献者
云存储公测特邀嘉宾
云存储公测资格用户，见证云存储的成长
报警盒子公测特邀嘉宾
报警盒子公测购买用户
荣誉内测组成员
荣誉内测组成员
萤石团队成员
萤石答疑高手
萤石工程商
萤石工程商请教使用http协议播放流媒体的web处理机制
可是，如果直接通过web服务器提供的http协议，在中播放流媒体视频，web服务器的处理机制如何呢？如嵌入到web页面的视频可能是：http://192.168.0.95:8080/abc/video/2124/test.mpg。
多用户同时访问这个视频的页面时，web服务器对每个用户视频流的带宽分配是如何进行的呢？--------------------------------------------------------------既然是基于http协议的话
和一般的WEB服务器一样的。您所在位置： &
&nbsp&&nbsp&nbsp&&nbsp
嵌入式网页流媒体视频点播系统的设计和实现.pdf53页
本文档一共被下载：
次 ,您可全文免费在线阅读后下载本文档。
文档加载中...广告还剩秒
需要金币：200 &&
你可能关注的文档：
··········
··········
华中科技大学硕士学位论文 Abstract Withthefast oftheWeb bandwidthofthe developmenttechnology，the network．both
bonenetworkandthelocalaccess network,is and becominglargerlarger,whichprovide infrastruetureforbroadband andmore toaCCeSS
necessary applications．Morepeopleprefer
information ofthesecreateexcellentcondition interactively．All fortIle ofthe development
VOD technology． Videoon the Server Video thevideo andother demand，with storing programs
multimedia theclientswithinteractivevideo涮-vicethe information,provides through
transmissionnetworkand ConsumerPremises ofthetraditional Equipment．Theproblem ofvideo isthatbecausethesizeofmediafileis than
quomodo transmitting usuallylarger thelimitofthenetwork theclients to
other,andadding brandwidth，makes waitinglong
beforethe whattheclientsneed playing．So isanew ofvideo which quomodo transmitting
thelimitofthebrandwidththat isthe Media．ItCan through just Streaming
transmitand mediafiles withthe forthewholefile play continuously，dispensewaiting
downloading． This WaS and howtorealizea MediaVOD technologyinvestigated Streaming system theJSP WaSalso enhancedthe ofthe
using language program investigated．It capability forthe OnWeb oftheJSP．Atthesame the
system superiority application time,itoptimize toembedthe the into Web．it auniform interfacefor
system mediaplayer provides
themedia tomakean Web playing．How Embedded MediaVod
come Streaming
trueiSresearched here． On Embedded
Keywords：Video Demand，StreamingMedia,JSP，Web II 独创性声明 本人声明所呈交的学位论文是我个人在导师指导下进行的研究工作及取得
的研究成果。尽我所知，除文中已经标明引用的内容外，本论文不包含任何其
他个人或集体已经发表或撰写过的研究成果。对本文的研究做出贡献的个人和
集体，均已在文中以明确方式标明。本人完
正在加载中，请稍后...如何使用HTML5嵌入视频 - Just Code - ITeye技术网站
博客分类：
如何使用 HTML5 语法在 Web 页面中嵌入视频呢？非常简单：
&video id="sampleMovie" src="HTML5Sample.mov" controls&&/video&
就是这些！这就是向网站添加视频播放器所需的全部工作，无需任何第三方插件或嵌入其他网站的代码，只要一个简单的标记即可。
实际情况可没有这么简单。
HTML5 的复杂性与语法无关，而是源自浏览器支持和视频编码。Web 开发人员习惯了纠结于浏览器的兼容性，但浏览器制造商在编解码器标准方面的分歧更让人头疼。为了构建一个成功的 HTML5 网站，您需要考虑 Chrome 4、Firefox 4 和 Internet Explorer 之类的现代浏览器如何实现 HTML5 视频 Web 标准，以及如何处理用户在旧版浏览器中查看视频的情况。
限制和好处
首先，要设定期望值，您应该知道播放视频时
HTML5 规范中目前还没有包括全屏播放。目前只有几个浏览器（不是全部）支持全屏播放。
默认的播放器菜单都是非常基础的，而在品牌认知的皮肤或复杂的观感上可能花了很多开发精力。除此之外，不同的浏览器仍以不同的方式实现 HTML5 和 CSS。例如，添加圆角时，您的视频播放器在
和 中看起来可能是圆角，但在
和 Safari 中还是方的。
规范不允许平滑或自适应流，而这是一个正规视频播放网站的基本功能。
更重要的是，规范并不（而且显然不会）包括数字版权管理 (DRM)。这意味着永远不会通过 HTML5 传递受版权保护的内容（至少版权持有人不会）。
当然还有编解码器的问题。稍后将提供此主题的更多信息。
您放弃这些东西后得到了什么？实际上，得到的不多。
首先，不专注于视频的网站其开发人员可以更加容易地实现网站流媒体，而无需通过第三方视频网站，如YouTube 或 Vimeo 等。以前，开发人员直接嵌入视频有三种主要的选择：
嵌入必须完整下载后才能播放的非流媒体文件
购买第三方插件（这不一定适用于所有浏览器）
使用专用的媒体服务器，这是一个非常昂贵且/或对于大部分网站而言太过复杂的解决方案
HTML5 允许开发人员在无需其他第三方软件支持的可更换皮肤播放器中实现流媒体，从而缓解了这些问题。
第二，HTML5 规范允许开发人员为已有定论的平台提供视频，如iOS 产品（iPhone、iPad）。但看待这个问题的方式有点不同，它使开发人员从限制或控制如何交付媒体的专有交付平台中解放出来。毕竟，这是开放标准的目的所在。
最后，HTML5 不是外来的技术，它是HTML 的最新修订版。这意味着 JavaScript 和 CSS 能够与它很好地协作。与现有的 HTML 源代码一样，开发人员可以在客户端或服务器端操作这些代码。
视频编解码器
前文已经提到，HTML5 视频最大的挑战是在多个编码解码器中准备和纳入您的内容。目前，每个浏览器有其自己的首选视频格式。非无缝实现的 HTML5 视频将会变得更糟。
现在视频编码有三种选择：
H.264 – 一种可以利用硬件加速的流行格式，由桌面和设备的图形芯片提供支持；也是市场上许多较新的视频和移动设备的默认录制格式；但是，该格式是有专利的，虽然对非商业用途仍然免费，但它很复杂，也比较昂贵。请参考了解更详细信息。何时进行商业内容分发。支持：IE 9、Safari 3.1 和 Chrome（目前）
Ogg Theora – 一个开放标准，没有专利问题，是免费的。支持：Firefox 3.5、Chrome 4、Opera 10.5。
VP8 (WebM) – 一个较新的标准，最近被 Google 收购，并作为一个开源发布，免费（但仍有专利）的格式。支持：Firefox 4.0、Chrome 6.0、Opera 10.6。
下图可让您更容易了解此内容：
Chrome 值得特别一提，因为 Google 实际将删除对三种 HTML5 视频格式之一的支持。收购 On2（WebM 格式的开发商和赞助商）后，Google 宣布以后的 Chrome 的版本将不再支持 H.264。他们已经根据 BSD 许可证发布了 WebM，授予全球用户免费、非独占的、免版税的专利许可。虽然 Chrome 是目前唯一支持所有三种格式的浏览器，但市场将会很快分成两个 OS 默认的浏览器阵营，只支持 H.264 的和 Safari，以及支持除 H.264 外其他标准的所有其他浏览器。
严重警告：为了简化此处的讨论，本说明不深入探讨三种基本格式之间的差异。一旦涉及视频和音频配置文件的不同可能性，以及视频和音频容器和编解码器 之间的区别，事情会变得更加复杂。例如，虽然 iPhone 4 用 H.264 格式录制视频，但不能将该视频直接放到 HTML5 网站；必须先通过转换器运行它。
最好能有一个无所不包的公告，说明视频标准X 是普遍支持的，应该作为HTML5 视频的首选格式。不幸的是，正如您从上文看到的，情况并非如此。如果您包括用户驱动的浏览器扩展，那么支持最广泛的格式就是 Ogg Theora。但是，你不能假定用户，特别是公司工作场所中的用户，只是为了观看 HTML5 视频就拥有安装其他视频编解码器或浏览器扩展的知识或能力。如果出于某种原因，您必须选择某一个视频编解码器，应该选择哪一个？这不一定。考虑以下选择：
在这三个标准中，H.264 最具人气，质量可靠，受到了媒体专业人士的认可。它还受到一些业内最大公司的支持，包括Microsoft 和苹果，具有MPEG LA 的授权。因此也有个最主要的问题：H.264 不是免费的。
对于消费者来说，它当然是免费的。大部分开发人员都不用担心授权问题（）。但是，视频分发网站就不一定了。H.264 专利授权的来龙去脉超出了本文的范围（），只要说大家有很多问题就够了。
对于大多数开发人员，专利问题将很大程度上归结于和图像质量之间的哲学争论。与 Ogg（参见下文）和VP8 () 相比，H.264 提供了更高的图像质量和更好的媒体流。由于包括 PC 和移动设备等多种平台上都具有硬件加速功能，它还具备性能优势。
最后，考虑易生产性，这不是一个无关紧要的问题。所有主要的视频编辑器，包括 Final Cut、Adobe Premiere 和 Avid，都导出为 H.264 格式。Ogg Theora 或 VP8 则不行。如果您的商店生产自己的视频，并且数量众多，那么仅使用 H.264 将节省很多工作。
Ogg Theora
Ogg 是唯一一个真正没有专利负担的标准。但是，也可以说是的标准，虽然相差其实不多。与H.264 的多次发现，H.264 仍占上风。虽然 Ogg 可将内容编码为更紧凑的文件，但它产生的图像品质比 H.264 的要低，并且在媒体流能力上会更差。
VP8 (WebM)
在高质量但存在专利问题 (H.264) 和质量较差但免费 (Ogg) 这两个极端之间，VP8 占有一席之地，它可能三个标准中最具争议的一个。到目前为止，测试表明 H.264 提供的视频品质比
略高，但这种差异在大多数商业活动中可以忽略不计。
更大的问题在于开放标准。一方认为，Google 远离了 H.264 转而支持其“开放”，甚至在 Creative Commons 许可证下发布了 WebM。另一方面，有很多人争论说，在这种情况下，“开放”。以 JPEG 诉讼为例，，即使 WebM 不会出现 Google 引起的专利问题，如果没有 Google 明确的用户免责申明，许多公司和个人部署 WebM 视频时，都有可能让自己面临 MPEG LA 的专利侵权诉讼。
总之，在大多数情况下，没有一种办法能满足所有情况下所有项目的需要。但对于大多数情况下的大多数项目，您可能都希望使用 H.264。它不仅仅是生产和消费端使用最广泛的格式，而且由于硬件加速而具有明显的性能优势。对于商业的视频网站，为了开拓新市场，可能必须咬紧牙关支 付庞大的许可费。
但是，这场辩论往往由于一个主要因素而无果而终：现在或在不久的将来，所有浏览器是否都支持 HTML5。但是，并非所有浏览器都支持所有编解码器。就像您不会编写在 IE 中看起来不错，但在 Firefox 中一团糟的样式表一样，您希望创建跨平台兼容的视频标签。
视频转换器
对于开发人员，这意味着在实际情况下需要将视频内容至少编码为两种视频格式（最好是三个）才能符合 HTML5 规范的要求。幸运的是，有几个工具随时可以帮助您完成此任务。
：您的主要工具，此开放源代码转换器有 Mac 和 Windows 版本，可以将几乎所有视频源转换为所有可能要使用的 HTML5 格式，以及几个其他设备和平台特定的格式。
：另一种用于 Mac 和 Windows（和 Linux）的开放源代码转换器，Handbrake 是专门转换为 H.264 的出色工具。
：MPEG Streamclip 虽然是不开放源代码，但Mac 和 Windows 用户可以免费使用。它也处理 lH.264，同时它也可以转换为 HTML5 规范之外的许多其他有用格式。
：一种专业工具，Firefogg 是一个 Firefox 扩展，只能将视频转换为 Ogg 的格式，并因此得名。要使用它，需要先下载 Firefox，然后再安装扩展。
&video&标记
您应该会记得，HTML5 在嵌入视频时本质上归结为使用一个标记：&video&。但正如其他 HTML 标记一样，有很多参数选项。以下是标记本身中的一些要点：
src：视频源的位置和名称，它的工作原理与 &img& 标记的 src 参数相同。但是要注意，在这里不是识别视频源，您可以并且也应该在标记外部识别（参见下文）。
&video id="sampleMovie" src="HTML5Sample.mov"&&/video&
width和height：（可选）视频的尺寸。更准确地说，这是视频帧宽度和高度，而不是视频本身。与 &img& 相似，省去此选项将导致浏览器使用视频源的默认尺寸。但是与 &img& 不同的是，使用与源不同的大小将缩放视频，而不是扭曲它。换句话说，嵌入的视频将保留其源的比率。如果您指定的大小小于源，整个视频将会缩小。但是，如果 您指定的大小大于源，视频将以其原始大小显示，所指定尺寸的其余部分将使用空白区域填充。
&video id="sampleMovie" src="HTML5Sample.mov" width=”640” height=”360”&&/video&
controls：添加默认视频控件覆盖。如果您不想创建自己的自定义控件，这是非常有用的。但是，如果想深入 研究自定义播放器控件，可以使用 JavaScript 和 CSS。该规范允许操作 play ()、pause()、currentTime、volume、muted 等方法和属性。
&video id="sampleMovie" src="HTML5Sample.mov" controls&&/video&
preload：只要用户点击页面就开始下载视频。要指示预加载视频，只需包括该属性。要指示其不预加载，将该属性设置为等于"none"。
&video id="sampleMovie" src="HTML5Sample.mov" preload&&/video&
&video id="sampleMovie" src="HTML5Sample.mov" preload=”none”&&/video&
autoplay：流氓参数。该参数指示浏览器加载页面时就播放视频。不要使用它。
&video id="sampleMovie" src="HTML5Sample.mov" autoplay&&/video&
接下来是见证奇迹的时刻。HTML5 规范包括一个方便的古怪功能，可以弥补当前围绕视频格式所发生的浏览器功能障碍。不使用 src 属性指定视频源，您可以在&video& 标记中嵌套多个标记，每个都有不同的视频源。浏览器将自动浏览列表并选择第一个能够播放的视频。例如：
&video id="sampleMovie" width="640" height="360" preload controls&
&source src="HTML5Sample_H264.mov" /&
&source src="HTML5Sample_Ogg.ogv" /&
&source src="HTML5Sample_WebM.webm" /&
如果在 Chrome 中测试该代码，将获得 H.264 视频。但是在 Firefox 中运行它，会在相同的地方看到 Ogg 视频。
理想情况下，虽然不是所有浏览器都绝对需要，您应该在 type 参数中包括 MIME 类型，确保与所有的浏览器兼容。此参数应指定视频类型，以及视频和音频编解码器。参数的细节取决于视频的编码方式。在这里可以找到很多可能的方案：。
&video id="sampleMovie" width="640" height="360" preload controls&
&source src="HTML5Sample_H264.mov" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' /&
&source src="HTML5Sample_Ogg.ogv" type='video/ codecs="theora, vorbis"' /&
&source src="HTML5Sample_WebM.webm" type='video/ codecs="vp8, vorbis"' /&
有关正在使用的所有三种视频类型的示例，请访问。
在此页面上，您会看到三个不同视频的源代码：H.264、Ogg 和 WebPM。视频本身标有它们的编解码器，以便您查看浏览器中显示的内容。
关于 MIME 类型的一个小窍门：您的服务器需要配置为可识别各种类型。对于 Windows Server，这意味着将不同的 MIME 类型项添加到 IIS。对于 Apache 服务器，您需要将 添加到 httpd.conf 或本地 .htaccess 文件中：
AddType video/ogg .ogv
AddType video/mp4 .mp4
AddType video/webm .webm
虽然完整的多源 &video& 标记可在多个 HTML5 就绪的浏览器上工作，但它仍然没有解决旧的、HTML5 之前的浏览器问题。幸运的是，该规范包括一个向下兼容机制。
将目前正在使用的任何&object& 标记，或者将使用的 HTML5 之前的标记，添加到 &source& 参数列表的底部。通常情况下，此对象将指定您使用的播放器（假定是第三方插件），以及该播放器的参数和源。下例使用流行的免费第三方播放器 Flowplayer。
&video id="sampleMovie" width="640" height="360" preload controls&
&source src="HTML5Sample_H264.mov" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' /&
&source src="HTML5Sample_Ogg.ogv" type='video/ codecs="theora, vorbis"' /&
&source src="HTML5Sample_WebM.webm" type='video/ codecs="vp8, vorbis"' /&
&object type="application/x-shockwave-flash" data="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" width="640" height="360"&
&param name="movie" value="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" /&
&param name="allowFullScreen" value="true" /&
&param name="wmode" value="transparent" /&
&param name="flashvars" value='config={"clip":{"url":"HTML5Sample_flv.flv","autoPlay":false,"autoBuffering":true}}' /&
这篇精彩文章更详细地解释了这一点：Kroc Camen “"。您还可以从这里查找包含所有三种视频格式和 flash 对象的代码生成器：Jonathan Neal 的 “”。
查看以下内容，了解HTML5 视频的更多信息，包括特定编解码器的复杂性：
– 如何快速地在您的网站上浏览高清视频
– 有关一般的 HTML5 和视频学习的重要资源
–比较不同视频编解码器（包括浏览器插件）的网站
– 关于 Ogg Theora 的更多内容，包括音频和视频编解码器、播放器和转换器
– 一篇有趣的报道，关于相互竞争的编解码器标准和浏览器制造商的观点
版权声明：转载时请以超链接形式标明文章和作者信息及本声明 文章引用地址： 作者：iefans
浏览: 7729668 次
来自: 洛杉矶
要是包含C1Calendar，内容就更完善了
实现客户端扫码登录分为下列四步：1. Web页面生成二维码生成 ...
帮助到我了。。尤其是第一个参数 ，我就是这直接载入 ...
谢谢,辛苦啦