再谈IE中Flash控件的自动激活 at Taobao.com UI Team

昵称18211 2007-01-22

展开全文

我在Ajax中国上曾经对比过国内门户网站对Flash激活限制的处理。除了qq.com，各大门户网站上的flash都已经解决了激活限制的问题。淘宝的页面上也常常会使用到Flash，激活限制导致用户的交互性体验感受不够友善。

我们一直想解决此问题。但是国内门户网站的做法都略为麻烦，要么需要为每个flash编写额外的js，要么就是在页面上放置flash的位置打上一块<script>补丁，利用SWFObject或者UFO提供的脚本写入flash。

网易的做法算是最技术的了，它的原理可以简单说一下（感谢在网易工作的朋友的阐析）：通过外部引入的js代码覆盖主页面的 document.write方法，这样在主页面上利用document.write方法时其实是外部文件的函数来写入的，实现了active控件下载和主页面分离。这样也就避开了激活限制。

可是，以上的所有解决方法，Flash都是通过脚本来写入的。比较注重web标准的网站会附上一段<noscript >来弥补禁用JavaScript的用户。但大多数是置之不理。

一番google(我真的是用了yahoo，不过没找到什么)，在SitePoint上发现了一份很有价值的文献ObjectSwap: Bypassing the ActiveX Activation Issue in IE，如获至宝。

ObjectSwap提供的实现只需要在<head>中引入一个脚本。虽然也是使用脚本，但其逻辑是在页面加载完成后，重写一次 <object>标签来实现自动激活。页面中的flash依然是标准的HTML。不需要通过document.write写入。而且对于禁用 js的用户Flash依然可以正常显示。这应该算是最unobtrusive的一种实现了。

最新的ObjectWrap 可以从这里下载。

原来的脚本有6k，我简化了一些逻辑，并通过条件注释让脚本只为IE6/7服务。让人欣喜的是，不光是Flash，只要是<object>，ObjectWrap都会处理，这样我们在安全登录淘宝或者支付宝输入密码的时候，也可以节约一个单击的气力了。

至于为什么重写<object>可以解决激活限制，就不要深究了，正如IE那一系列让人抓狂的CSS hack。我们只能逼自己记住它，傻瓜才会去弄清楚为什么。

最后向ObjectWrap的作者　Karina Steffens　致敬！

10 Responses to “再谈IE中Flash控件的自动激活”

Feed for this Entry Trackback Address

1 承志 Jan 17th, 2007 at 17:45

噢顶啊，够技术的！^_^
2 飞飞 Jan 17th, 2007 at 17:53

@_@顶啊~~~！！
3 wkcow Jan 17th, 2007 at 20:01

另外使用，swfobject 或者UFO 来进行的Flash搜索引擎优化也非常好的，即便是搜索引擎不理解flash，但有替代内容可以代替Flash的，保持两个内容一致，就不会被认为是作弊
4 Cat Jan 17th, 2007 at 23:38

看过CSS Mastery里面使用Flash Swaping的方法来实现标题特殊字体的办法，都应该能想到用Swaping的方法来做这个，不过就是Flash swap Flash罢了。现在终于有人做了，不错不错，直接拿来用就行。
5 coocboy Jan 18th, 2007 at 17:13

一般我从收藏夹打开taobao,鼠标默认位置就在这个flash上.
一开始还是有激活框的,
不过有一个明显的重写过程之后就OK了,呵呵.
6 Kejun Jan 18th, 2007 at 22:50

利用document.write Flash代码的方式不可取.在页面中间引外部js文件会中断页面下载.objectSwap.js也不完全unobtrusive,其中window.onload=function(){…}这个得在应用时改造一下.
7 zhua Jan 19th, 2007 at 12:02

//lol

“一番google(我真的是用了yahoo，不过没找到什么)，在SitePoint上发现了一份很有价值的文献ObjectSwap: Bypassing the ActiveX Activation Issue in IE，如获至宝。”
8 Dooky Jan 20th, 2007 at 22:44

一段js已经够用了，不过无法保持flash的透明背景，实在郁闷
9 小甲 Jan 21st, 2007 at 0:52

很有用：）多谢分享。