JS与SWF的通信体式格式

首页 > 代码库 > JS与SWF的通信体式格式

2024-11-10 14:08:39 203人阅读

　　1. 在页面中嵌入SWF文件

　　2. JS与SWF的通信体式格式

　　3. 常见题目与解决办法

第一项目组：在页面中嵌入SWF文件

　　既然是Flash与JS的交互那必然与他们的共同载体Web页面脱不了干系，也就是我们第一节的内容；

　　我们先来看一看Flash文件是以什么样的体式格式呈如今HTML页面傍边的。

　　第一种：古老且不合适W3C标准的嵌入体式格式：

</object>

　　把以上代码拷贝到你的html文档里面，批改一下flash文件的路径，如：<param name="movie" value="http://www.mamicode.com/xxx/xxx.swf" /> 和 <embed src="http://www.mamicode.com/xxx/xxx.swf" 就可以在你的站点里面显示Flash的内容了，按照须要你可能还会批改一下 width、height、bgColor 守候属性。

　　然则，当我们第一眼看到上班的代码时，是不是很晕啊，这是什么啊，这么长看上去如同有很多没有语意，并且有很多冗余的代码。的确这里面有很多让人不爽的处所，下面我们一一道来：

　　　　1）冗余的代码：

　　　　　　我们看到 width，height，quality，bgcolor align等等这些属性分别在 Object标签、param标签和 embed 标签里面反复定义了两次同样的值。

　　　　2）codebase 这个是什么意思，我须要么？

　　　　　　Microsoft Internet Explorer 3.0 版和更高版本应用 CODEBASE 属性检测用户的策画机上安装了哪个版本的 Macromedia Flash Player ActiveX 控件。若是用户的版本比 CODEBASE 指定的版本旧，那么 Internet Explorer 可主动从 CODEBASE 指定的地位下载并安装新版本的 Macromedia Flash Player。 - 起原；

　　　　　　经由过程上方的申明，我们知道它是来断定当前Flash文件须要的FlashPlayer的运行版本的。然则有更好的办法么？

　　　　3）为什么还要在object里套一层 embed标签。

　　　　　　OBJECT标签是用于windows平台的IE浏览器的，而EMBED是用于windows和Macintosh平台下的Netscape Navigator浏览器以及Macintosh平台下的IE浏览器。windows平台的IE哄骗Activex控件来播放flash而其它的浏览器则应用Netscape插件技巧来播放flash。

　　　　　　也就是说embed是来告诉非 IE的浏览器衬着当前的Flash文件所须要的信息。固然embed解决了非IE浏览器衬着Flash文件的题目，然则它无法经由过程W3C的验证。

　　　　为懂得决这些不爽，我们找到了下面这种更好的解决规划。

　　第二种嵌入体式格式：合适W3C 标准的嵌入体式格式：

</object>

　　比拟上一段代码，这段的确减轻了我们眼睛的肩负，没有了那么多多冗余代码，也合适W3C的标准了。细心的同窗估计也看到了 flash文件的路径又被反复定义了两次，跟上方的景象一样，data是满足非IE， <param name="move" src="""" />满足IE浏览器。

　　综合上方的两种体式格式，固然都解决了在页面中嵌入Flash的题目，并且第二中办法看起来更优雅，冗余代码很少，然则它们都有一个共同的题目：没有FlashPlayer检测；

　　也就是说若是当前的浏览器里面没有安装Flash Player 或者安装的浏览器版本不克不及满足要显示的Flash文件的最低的版本请求，就会导致浏览器不克不及正确的把Flash浮现出来。而此时屏幕前面的用户既没有看到正确的内容，也没有获得错误提示（当然，若是他压根没有安装FlashPlayer，浏览器会主动检测，并提示他安装FlashPlayer插件。）。那么我们怎么解决这个题目呢？为懂得决这些题目，我们持续寻找。。。

　　第三种豪华版嵌入体式格式登场：swfobject

　　我们先来懂得一下SwfObject是个什么器材。

　　swfobject 是一个js类库，它封装了很多办法，用这些办法可以帮助你搜检客户端的FlashPlayer景象和动、静态嵌入flash文件到页面中。

　　办法简单，快捷。下面是它的长处：

?　该模块中的JS脚本可以或许主动检测客户端机械上各类主流浏览器对Flash插件的支撑景象。使得插入Flash媒体资料尽量简捷、安然。

?　并且它很是合适搜刮引擎优化的原则。可以或许避免您的HTML、XHTML中呈现object、embed等非标准标签，从而合适加倍标准。

　　再来看看swfobjet的一个具体的例子：

swfobject.embedSWF（"test.swf"， "swfid"， "300"， "120"， "9.0.0"）;

</script>

　　是不是比上方的两种办法简单了很多。若是你只是嵌入一个Flash动画文件的画，上方的四句话都搞定了。

　　如许是不是很爽，代码量少了很多。。。

　　下面我们介绍一下SwfObject嵌入flash的具体办法：

var flashvars = {

nameA:"hello"，

nameB:"world"

}

var params = {

menu: "false"，

allowFullscreen: "false"，

allowScriptAccess: "always"，

bgcolor: "＃ffffff"，

wmode: "window"

}

var attributes = {

id:"test"

}

swfobject.embedSWF（"swf/test.swf"， "altContent"， "100％"， "100％"， "9.0.0"， "swf/expressInstall.swf"， flashvars， params， attributes）;

</script>

<h1>Flashvars Demo</h1>

<p><a href="http://www.adobe.com/go/getflashplayer">安装最新的FlashPlayer</a></p>

</div>

　　flashvars 　　是一个json对象，为flash传递一些初始化信息；

　　params　　　设置flash的一些衬着模式和靠山色彩，缩放模式，右键菜单、是否容许flash接见js里面的办法等

　　attributes 　设置嵌入flash完成时object标签的id，name等属性

　　如今我们具体介绍一下swfobject.embedSWF办法，该办法共须要10个参数，下面是具体介绍：

　　swfUrl（String ，必须的）指定SWF的URL。

　　id（String ，必须的）指定将会被Flash内容调换的HTML元素的id。

　　width（String，必须的）指定SWF的宽。

　　height（String，必须的）指定SWF的高。

　　version（String，必须的）指定你公布的SWF对应的Flash Player版本（格局为：major.minor.release）。

　　expressInstallSwfurl（String，可选）指定express install SWF的URL并激活Adobe express install。

　　flashvars（ Object ，可选）用name:value对指定你的flashvars。

　　params（Object ，可选）用name:value对指定你的嵌套object元素的params。

　　Attributes（Object，可选）用name:value对指定object的属性。

　　callbackFn（JavaScript function，可选）定义一个在履行embedSWF办法后，嵌入flash成功或失败后都可以回调的js 函数

　　对于不须要的参数可以省略，然则若是某个参数不须要，然则厥后面须要设置某个具体的值的时辰，请用 null 关键字占位，如：

　　swfobject.embedSWF（"swf/test.swf"， "altContent"， "100％"， "100％"， "9.0.0"， null， flashvars， params， attributes）;

　　上方说了swfobject会主动断定客户端的FlashPlayer景象，在这里怎么没有表现呢？我们这就来介绍一下。swfobject检测客户端景象的办法表如今以下三个方面：

　　　　1）<div id="altContent"></div>

　　　　上方的例子我们可以看到在这个div里面还有一些关于你要嵌入的Flash的一些简单描述和一个如今FlashPlayer的链接地址。这个DIV很首要，它的感化就是在若是客户端没有安装FlashPlayer或者FlashPlayer的版本不敷高，这段标签将不被调换，以达到提示用户这项目组内容要安装FlashPlayer才干正确显示。

　　　　2）swfobject.embedSWF办法里面的version参数；

　　　　version参数告诉了swfobject在满足那个Flahsplayer版本时才会调换上方的div标签，正确嵌入Flash文件，不然就不调换。

　　　　3）swfobject.embedSWF办法里面的 expressInstallSwfurl 参数

　　　　expressInstallSwfurl 参数是一个Adobe供给的用于主动进级FlashPlyaer的一个swf文件，当客户端安装了FlashPlayer 6+ 的版本，又达不到 verison参数描述的版本时，swfobject就会在页面里面显示这个expressinstall.swf文件，它会提示你是否要主动进级FlashPlayer。

　　别的，swfobject 还供给了两个检测FlashPlayer版本的办法：

　　　　swfobject.getFlashPlayerVersion（）

　　　　返回一个包含了已安装Flash Player首要版本（major:Number）、次要版本、minor:Number）、发行版本（release:Number）的JavaScript对象。

　　　　swfobject.hasFlashPlayerVersion（versionStr）

　　　　返回一个Boolean值，注解特定版本的Flash插件是否已被安装; 如：swfobject.hasFlashPlayerVersion（“9.0.124”）

　　　　到此，第一项目组就介绍完了，关于swfobject的更多信息可以查阅这里：http://code.google.com/p/swfobject/

第二项目组：JS与SWF的通信体式格式

　　所谓通信就是信息的互换，这里我们谈的是js与Flash之间的数据互换。

　　我们先来看一下 JS与Flash互换信息的三种体式格式。

　　　　1.经由过程Flashvars

　　　　　　Flashvars - Flash初始化信息的传递者，它由N组名值对构成；当你的flash文件须要某些初始信息的时辰就须要用到它。

　　　　　　若是你应用的是前两种嵌入办法，应像如许：<param name="flashvars" value="http://www.mamicode.com/text=这是flashvars传入的数据啊" /> 用 param 标签传递信息；

　　　　　　若是你应用的是 swfobject 就是用上方提到的，定义一个flashvars的变量然后在调用swfobject.embedSWF办法时传入这个变量;

　　　　　　或者上方的这两种办法都可以在你要嵌入的Flash文件地址后面加上问号传递入："xxx.swf？name1=hello&name2=world ";

　　　　2.JS调用Flash的办法，用参数传递信息给Flash或者获得Flash办法的返回信息

　　　　　　Flash对象.flash办法名字（参数1，参数2， …）;

　　　　　　如：

　　　　　　　　var flashObj = getFlashFun（“flashID”）;

　　　　　　　　var value = http://www.mamicode.com/flashObj.flashFunName（args）;

　　　　　　重视：

　　　　　　1.参数个数必须跟Flash里面的参数个数一致

　　　　　　2.非同域下须要获得Flash内部的容许 Security.allowDomain（… domains）

　　　　3.Flash调用js办法获得js办法的返回信息或经由过程参数传递信息给JS

　　　　　　ExternalInterface.call（js的函数名称， ”参数1”， ”参数2”， …）;

　　　　　　如：

　　　　　　 var value:String = ExternalInterface.call（“jsFunName“， ”argument1”， ”argument2”）;

　　　　　　重视非同域下设置 param 标签的 allowScriptAccess 属性的 value值为 always，如：

　　　　　　　　var params = {

　　　　　　　　　　allowScriptAccess: "always"

　　　　　　　　};

　　　　　　　　或：

第三项目组：常见题目解析与解决办法

　　1. flash得不到正确的初始化参数

　　　　–通干预干与号传递的参数被Flashvars体式格式传递的参数覆盖

　　　 –某些带"&"符号的flashvars值没有进行encodeURIComponent 编码

　　2. JS调用Flash办法失败

　　　　–Flash没有初始化完成　　- 延迟调用或者flash里面设置回调函数告诉js flash文件初始化完成

　　　　–获取flash对象的办法浏览器兼容性题目　　- 批改获取flash对象的js办法

　　　　–函数名不合错误应，或者Swf里面没有定义该办法

　　　　–Flash没有容许跨域调用其内部办法

　　　　–调用flash办法时参数数量不合错误应

　　　　–在飞舞，TT等国内有名盗窟版浏览器中刷新后无法调用Flash办法

　　　　　　两个解决规划：

　　　　　　　　1. 在flash文件地址后面加随机值不让Flash文件缓存；

　　　　　　　　2. 在Flash里面延迟添加js的回调函数。

　　3. Flash调用JS办法失败。

　　　　–allowScriptAccess: “never“

　　　　–跨域时没有设置：allowScriptAccess: “always“

　　　　–FLASH调用JS的时辰，JS对象还不存在

　　4. 弹层被Flash覆盖了!

　　　　–设置 wmode的值为： opaque 或 transparent;

　　　　　　var params = { wmode: " transparent“ };

　　　　–或者把弹层也做成Flash的（这个可实验性不强。。。）

　　　5. Firefox下无法输入中文

　　　　–设置 wmode的值为： window;

　　　　在这里我们简单懂得一下 wmode：　　　　

　　　　window 模式

　　　　默认景象下的显示模式，在这种模式下flash player有本身的窗口句柄，这就意味着flash影片是存在于Windows中的一个显示实例，并且是在浏览器核心显示窗口之上的，所以flash只是貌似显示在浏览器中，但这也是flash最快最有效力的衬着模式。因为他是自力于浏览器的HTML衬着概况，这就导致默认显示体式格式下flash老是会遮住地位与他重合的所有DHTML层。

然则大多半苹果电脑浏览器会容许DHTML层显示在flash之上，但当flash影片播放时会呈现斗劲诡异的现象，比如DHTML层像被flash刮掉一块一样显示异常。

　　　　Opaque 模式

　　　　这是一种无窗口模式，在这种景象下flash player没有本身的窗口句柄，这就须要浏览器须要告诉flash player在浏览器的衬着概况绘制的时候和地位。这时flash影片就不会在高于浏览器HTML衬着概况而是与其他元素一样在同一个页面上，是以你就可以应用z-index值来把握DHTML元素是隐瞒flash或者被隐瞒。

　　　　Transparent 模式

　　　　透明模式，在这种模式下flash player会将stage的靠山色alpha值将为0并且只会绘制stage上真实可见的对象，同样你也可以应用z-index来把握flash影片的深度值，然则与Opaque模式不合的是如许做会降落flash影片的回放结果，并且在9.0.115之前的flash player版本设置wmode=”opaque”或”transparent”会导致全屏模式失效。

懂得了各类模式的实现体式格式和意义在今后的开辟中就可以遵守具体景象选择设置wmode属性的值了。

　　　　所以在没有弹层被隐瞒的题目的时辰，大师尽量设置wmode为window模式，已进步flash的衬着效力和一些诡异的bug!

JS与SWF的通信体式格式

声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉：投诉/举报工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。

联系
我们

首页 > 代码库 > JS与SWF的通信体式格式

JS与SWF的通信体式格式

看完仍有疑问？有类似问题直接问程序猿