HTML 页面载入 Flash 插件的几种方法 前言 嵌入插件 效果图 结束语
之所以写这篇文章,主要是由于组长给提的一个新的需求——使用浏览器调用电脑的摄像头,来实现即时拍照的功能。在网上查了非常多资料,由于这样那样的原因,终于选择了使用flash插件来调用pc的摄像头。当然,这个需求是基于B/S架构的,因此,就在想怎么把它嵌入到前端的HTML页面中。
题外话
当然,这里还没有考虑到封装,主要是先以实现为目的,兴许工作再依据业务进行抽象,封装成通用的组件。好了,废话不多说,看重点。
嵌入插件
- 使用 object 和 embed 标签
代码展示
这样的方法用到的是 Object 和 Embed 标签,能够看到 object 的非常多參数和 embed 里面的非常多属性是反复的。浏览器兼容性,有的浏览器支持 object,有的支持 embed,这也是为什么要改动 Flash 的參数时两个地方都要改的原因。这样的方法是 Macromedia 一直以来的官方方法,最大限度的保证了 Flash 的功能,没有兼容性问题。但如今来看,它还是存在非常大问题的。首先,无法通过验证,因为为了兼容性而嵌入的 embed 标签是不符合 W3C 的规范的。当然,假设你不在乎什么规范不规范,另当别论。其次,微软因为种种原因,在 sp2 后限制了 IE 的 ActiveX 的使用模式,就是在页面中的 ActiveX 有一个虚框,须要用户点击一次才干正常交互。Flash是作为一个 ActiveX 嵌入到网页中的,所以它也会受牵连,仅仅有通过 JS 嵌入 Flash 才干解决问题。再次,没有 Flash 版本号检測,假设版本号浏览器的flash插件版本号不够,或者不能正常显示你的 swf 文件,或者会弹出一个 ActiveX 的确认安装的框——这个框对非常多用户来说是非常恐怖的。
- 仅仅使用 object 标签
代码展示这样的方法仅仅用到了 Object 标签,事实上也就是 Flash satay。因为没有了 embed 标签,能够通过验证,是标准的嵌入 Flash 的方法,浏览器兼容性也不错,看起来差点儿完美,只是还是有问题的。首先,须要一个 holder swf 来载入你的目标 swf 以保证 IE 中的 stream 能力,假设你须要通过 flashvars 来传參,或者和页面的 JS 交互,会非常麻烦。其次,和第一种方法一样,也会弹出一个ActiveX的提示框,没有版本号检測。再次,一些低版本号的浏览器(如低版本号的Safari等)不认同这样的方式,对它的兼容性不好。
- 仅仅使用 embed 标签
代码展示这样的方法仅仅用到了 Embed 标签,对照效果来说,还是非常不错的,浏览器的兼容性也还不错,都是能够载入的。当然,因为 embed 标签是不符合 W3C 的规范的,所以也不推荐使用这样的方法。
- 使用JavaScript嵌入
使用 JS 来载入 Flash 插件,网上已经有非常多的方法了,并且也有非常多不错的 JS 插件供大家选择。我这里仅仅拿 SWFObject 来简单的介绍一下。首先,你须要下载一个 SWFObject 插件包,该插件包中包括一个 JS 脚本,这个是你须要引入的脚步文件。还包括两个 html 的样例,大家能够模仿一下。当然,你还能够去 SWFObject 的站点了解一下,网址请点击 这里 。代码展示效果图
结束语
对照这几种方式,我更推荐使用 JS 嵌入的方式来载入 Flash 插件,这样的方式不仅能保证实现 Flash 的全部功能,同一时候在各浏览器的兼容性方面也都表现不错,而且 JS 还能够提供很多其它的扩展功能,更主要是能够被很多其它的人复用,降低不必要的冗余代码。
插件下载地址:SWFObject