探究浏览器播放视频

浏览器播放视频,分为两种:

一、内联视频(Inline Videos)

当视频被包含在网页中,或作为网页的一部份,它就被称为内联视频。
通过使用 <img> 元素,可向网页添加内联视频。
许多人,对这内联视频是很反感的。就好比,大半夜大家都睡了。突然打开一个页面蹦出视频来,吓老子一跳!我找到资料时,突然某个网页吱哇乱叫!还以为打开小网站了呢。所以有的已经关闭了内联视频,笔者建议仅仅在用户希望听到声音的地方包含内联视频。比方说在用户打开页面后,点击某个链接来观看视频,看看某人的空间听听音乐。
①使用 <img> 元素
笔者找到了一则广告视频作为测试

该方法,笔者没有调用成功!
②使用 <embed> 元素
<h2>来看小视频喽</h2>
<embed src="file/ff9dba34c2a6515274496c87ec8c9280.avi" />
演示效果:很成功,打开浏览器就在自动播放

接下来,我们看看对IE浏览器的支持度(降低IE版本)。
可以看出IE5+都支持这种方法

那我们换个浏览器呢?
在某些浏览器上(包括谷歌),提示的是下载

貌似这个方法是IE的专属特性!
③使用 <object> 元素
<object data="file/d6f955c6920b487c07038a21593464ac.f4v" type="video/avi" />``
经笔者调试,该方法对IE的支持度是(Edge模式,其他版本均失败了);

谷歌等浏览器,不支持

④使用超链接
<a href="file/ff9dba34c2a6515274496c87ec8c9280.avi">点我看小视频</a>
笔者再一次调试出下载功能了,失败。
⑤HTML 5 + <object> + <embed>
笔者也没有调试出来:

    <video width="320" height="240" controls>
                <source src="file/ff796725d9f2ac7dad654e0db37b3e75.mp4" type="video/mp4">
                <source src="file/ff796725d9f2ac7dad654e0db37b3e75.ogg" type="video/ogg">
                <source src="file/ff796725d9f2ac7dad654e0db37b3e75.webm" type="video/webm">
                <object data="file/ff9dba34c2a6515274496c87ec8c9280.avi" width="320" height="240">
                    <embed src="file/ff796725d9f2ac7dad654e0db37b3e75.swf" width="320" height="240">
                </object>
            </video>

二、使用助手(Plug-In,插件)

助手应用程序,是一种可通过浏览器启动来“帮助”浏览器播放视频的程序。助手应用程序也称为插件(Plug-Ins)。
助手应用程序可通过使用 <embed> 元素来启动,或者 <applet> 元素及 <object> 元素。
使用助手应用程序的一项巨大优势是,允许用户控制播放器的某些设置。
大多数助手应用程序允许手动地或通过编程控制音量设置以及播放功能,比如回放、暂停、停止和播放。
至于第二种方法嘛。等笔者有空的时候再说吧,天就到这了!

原文地址:http://blog.51cto.com/13479739/2173025

时间: 2024-11-09 15:32:07

探究浏览器播放视频的相关文章

通过nginx实现浏览器播放视频

本文档只适用于服务器没有安装nginx.如果已经安装nginx,可能还需要其它方法. 确认本机IP地址: [[email protected]_10-0-129-98 ~]# ifconfig eno16777728: flags=4163<UP,BROADCAST,RUNNING,MULTICAST>  mtu 1500         inet 10.0.129.98  netmask 255.255.255.0  broadcast 10.0.129.255         inet6 

对于微信内置浏览器中不能小窗播放视频原因的分析以及解决

菜鸟:微信内置浏览器中不能小窗播放视频肿么办??? 师傅:徒弟莫猴急,待师傅一一道来:首先,喺发生急事嘅情况下,我哋最要保持冷静,噉才可以施展出一个有思维.有智慧.有头脑嘅人,应该有嘅气质与才华. 菜鸟:哇,知啦,跟住我应该点做哩? 师傅:求百度啊!!!!!! ......以上是背景......以下是根据百度爬到的内容进行的分析与总结...... 分析webkit-playsinline为什么不能在微信内核中起作用的原因: 1:在不考虑微信内核的浏览器中用html5的video方式播放视频时:在

在微信端使用video标签,播放结束会出现QQ浏览器推荐视频的解决办法(vue)

会出现播放结束显示QQ浏览器推荐视频的原因:(我是vue的项目,而且我是新手,只是单纯的给大家分享一个方法,代码比较low请自动忽略) 因为在x5(QQ浏览器)内核中,把video标签劫持了,只要是检测到使用了video标签的话(包括使用了基于h5的video写的插件),就会出现这种情况. 解决办法: html部分:(需要的是一个id选择器,其他的请忽略,src中的内容是调接口返回) <video autoplay id="end" controls :src="cha

手机浏览器自动播放视频video(设置autoplay无效)的解决方案

1.问题的提出 某一天接了个需求,需要在手机的H5页面内加入视频,我开开心心做完,准备交付的时候,问题来了,PM想要用户一进入页面,视频就开始播放,不需要用户手动点击. 2.尝试解决 加autoplay "视频自动播放"这个需求是ok的,那我就在video标签上加个autoplay属性嘛,在PC端浏览器里面试了一下,运行流畅,没有遇到什么问题,但是放在手机浏览器里面打开,就跟没设置autoplay是一样的. 监听canplay 那不行的话,我在页面加载完成的时候,监听video的can

Firefox 无法播放视频

网上有很多介绍Firefox无法播放视频的解决方案,最常见的问题就是:为正确安装flash插件.其他的插件与flash插件冲突. 系统Win8.1(64位)下新安装了Firefox 29,flash插件也已正常安装,访问视频网站始终播放不了视频. 进入系统如下目录: C:\Windows\SysWOW64\Macromed\Flash\mms.cfg 1 SilentAutoUpdateEnable=1 2 AutoUpdateDisable=0 3 ProtectedMode=0 在文件尾部增

IIS主机在某些情况下无法播放视频的设置方法

默认情况下,Windows Server的IIS主机是不支持FLV文件类型,通过http访问是无法播放视频. MIME类型就是设定某种扩展名的文件用一种应用程序来打开的方式类型,当该扩展名文件被访问的时候,浏览器会自动使用指定应用程序来打开. 设置MIME,让IIS支持更多文件类型. 在IIS中添加FLV的MIME类型: IIS里面的站点属性->http头->添加Mime类型 扩展名填写:.flv Mime类型填写:flv-application/octet-stream 重新启动该站点 其它

H5 播放视频常见bug及解决方案

本文摘自:本文来自“小时光茶社(Tech Teahouse)”公众号 原文:https://mp.weixin.qq.com/s/MM5ZwCiWLAeHalsNYMImnw 1. 自动播放问题 通过autoplay属性视频的自动播放需要在video标签上添加autoplay属性, 如: <video autoplay><video/> 但是在很多浏览器里,如iOS下并不支持这个属性,在iOS下必须给webview设置: self.wView.allowsInlineMediaPl

Html5之高级-4 HTML5视频处理(H5中播放视频、编程实现视频播放器)

一.在 HTML5 中播放视频 在 HTML5 中播放视频 - HTML5 中提到最多的是视频处理,视频也是互联网中的重要应用.在HTML5中,增加了一个元素,以便在HTML文档中插入和播放视频,这个元素就是video元素 - video元素提供了播放.暂停和音量控件来控制视频,也提供了width和height属性控制视频的尺寸.如设置的高度和宽度等. - 使用video元素至少要提供两种视频格式的文件: OGG和MP4 - OGG: 包含Theora 视频和 Vorbis 音频解码器 - MP

flash播放mp4插件轻松搞定播放视频问题

1.使用SWFObject插入Adobe Flash媒体资源兼容性好代码 <script src="http://js.kuwo.cn/yinyue/webmv/swfobject.js"></script>SWFObject是一个用于在HTML中方便插入Adobe Flash媒体资源(*.swf文件)的独立.敏捷的JavaScript模块.该模块中的JavaScript脚本能够自动检测PC.Mac机器上各种主流浏览器对Flash插件的支持情况.它使得插入Fla