当Flash置于HTML容器中时,经常会遇到AS与JS的通信问题,例如:JS能否调用AS中的变量、方法,AS能否调用JS中的变量、方法等等。答案是肯定的。随着技术的不断发展,解决方案也是多种多样的。
  在我总结的HTML与FLASH之间的“静态”传值一文中提到了JS使用SetVariable方法来设置FLASH中的变量,认为此法已经过时。对此我表示同意,但上文重点毕竟不是在讨论JS与AS的通信,因此另外对AS与JS通信做一个个人总结,欢迎大家讨论。
  实现JS跟AS的通信,目前可选方法比较多,但早期的方法在使用便捷和功能上都不是很完美,下面做一简要说明:

  一、getURL  getURL("javascript:history.go(-1)");

  通过URL协议来访问页面中的javascript,上面控制浏览器历史的代码很眼熟吧,诸如此类我们平时在定制页面收藏,发送邮件时都会经常使用这种方式。虽然你也可以调用页面中自己定义的JS函数,但我个人认为局限性还是比较大,函数的参数传递并不是很灵活,无返回值,而且只能实现AS调用JS,反之不行。

  二、fscommand命令
  使用fscommand来调用AS定义的方法也是一个很常用的方式,但我们需要在HTML页面中定义一个具有规定格式的myFlash_DoFSCommand函数,首先定义这个函数我个人就觉得麻烦,而且也只能实现AS调用JS,无函数返回值。

  三、SetVariable  
  上面两种方法都只能实现AS调用JS,而SetVariable恰恰相反,只要我们稍微做下处理,他就可以帮我们变相调用AS中的方法。大概思路如下:AS中设置一个状态变量,并使用Object的watch方法对其监视,JS通过SetVariable来修改这个状态变量,一旦侦测到了变量的改变,那就可以根据不同的状态值来选择执行AS中的相应函数了。如果需要考虑用户的低版本播放器,那么你可以考虑下该方法,个人认为还是比较灵活的。

  可以看出上面的这些做法都有一定的局限性,所以在我们的应用中很多时候都不得不将他们结合使用。而下面我要具体介绍的就是ExternalInterface的做法,通过它你能轻松实现AS与JS的双向方法调用,从而也解决了双向的变量访问,详细介绍可参见FLASH帮助文档和Adobe的官方教程,下面用两个简单例子来说明ExternalInterface的使用。

一、AS调用JS的方法(实例演示)

Flash中代码:
//导入包
import flash.external.*;
get_btn.onRelease = function(){
//调用页面中的JS函数
var temp_str = String(ExternalInterface.call("say", "Hello,World"));
result_txt.text = temp_str;
}

Html中代码:function say(txt){
return txt;
}

  没错,就这么简单,JS函数定义没有任何要求,AS中使用call方法直接调用就可以了。

二、JS调用AS的方法(实例演示)

FLASH中代码://导入包
import flash.external.*;
//提供JS访问的函数名
var _method:String = "say";
//指定本地函数中this变量的作用域,可设置为null留空
var e_area:Object = null;
//AS内部函数名
var method:Function = say;
//将函数注册到容器列表
var wasSuccessful:Boolean = ExternalInterface.addCallback(_method, e_area, method);
//查看注册是否成功
if(wasSuccessful){
result_txt.text = "函数注册成功";
}
//本地的函数
function say(txt:String) {
result_txt.text = txt;
}

Html中代码:<div>
<form>
<input type="button" onclick="callExternalInterface()" value="JS调用AS方法" />
</form>
<script>
function callExternalInterface() {
thisMovie("demo").say("Hello,World");
}
//浏览器兼容访问DOM
function thisMovie(movieName) {
if (navigator.appName.indexOf("Microsoft") != -1) {
return window[movieName]
}
else {
return document[movieName]
}
}
</script>
</div>

  其中红色代码是核心代码,其作用原理是AS端通过addCallback函数把AS内部定义的方法注册为可从容器中调用,允许自定义另外一个方法名供JS来调用这个方法,函数调用成功返回true,失败返回flase,在此例中通过wasSuccessful变量来判断函数是否注册成功。函数注册成功以后,JS可以通过DOM来访问SWF对象,然后直接调用预定义的方法即可。
  
  通过比较可以看出,使用ExternalInterface来完成AS和JS的通信,代码可以更简洁,更清晰,功能也更强大,不过还有些细节你需要了解,需要使用8.0以上的播放器,对于调用的JS函数不能使用递归,同时安全域限制也必须在考虑之中

JavaScript与Flash的通信的更多相关文章

  1. SWFObject: 基于Javascript的Flash媒体版本检测与嵌入模块

    原文地址:http://www.awflasher.com/flash/articles/swfobj.htm SWFObject: 基于Javascript的Flash媒体版本检测与嵌入模块原文:S ...

  2. javascript调用Flash里对象的方法(函数)搞了五个小时。

    搞了几个小时后,才发现,之前走的路是错的. 今天在Firefox浏览器上测试一个javascript调用Flash中的一个对象的方法时遇到问题了, 一搞就整整搞了一个下午. 我记得之前我用Flash8 ...

  3. Javascript与Flash通信全解析

    原文:https://www.imququ.com/post/39.html Flash已经提供了ExternalInterface接口与JavaScript通信,ExternalInterface有 ...

  4. [转]Flash Socket通信的安全策略

    昨天做测试的时候遇到一个问题,做好的SWF在Flash AS3中调试通过,但是发布到html中之后就无法得到数据了.查了一些资料之后找到了解决办法.这里感谢 剑心 提供帮助,以及同事若水三千提供Jav ...

  5. Flash Socket通信的安全策略问题 843端口

    1.问题描述       将flash发布为html格式后,加载页面后,swf无法与服务器进行socket通信.Flash端显示的错误为:securityErrorHandler信息: [Securi ...

  6. WebSocket起航 JavaScript客户端和Server通信

    Message  =>JSON  => Move 客户端发给服务器总是Move  server.send(JSON.stringify({row: row, column: column} ...

  7. javascript模拟flash头像裁切上传

    是的,jq已经有类似的插件了,或者干脆用flash算了,为什么我还要自己写?因为造(wo)轮(bu)子(hui)也(flash)是一个学习的过程,轮子不会造,将来怎么造飞机?先来一张最终效果图: 一. ...

  8. JavaScript 中的多线程通信的方法

    在Html 5诞生之后,我们可以使用javascript来实现多线程处理.H5 新增了一个web workers api,使用这个API,用户可以很容易地创建在后台运行的线程,H5 中被称为workd ...

  9. javascript客户端与服务器端通信

    高性能的网络通信包括以下方面:选择正确的数据格式和与之匹配的传输技术. 一.数据格式 用于传输的数据格式有: 1)html,仅适用于特定场合,传输数据量大,不过它可以节省客户端的CPU周期, 2)XM ...

随机推荐

  1. 1、ListView自定义控件下拉刷新(一)

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layo ...

  2. 1. 搭建NDK集成开发环境

  3. [视频监控]用状态机图展示Layout切换关系

    监控系统通常会提供多种Layout给用户,用于满足不同需求,如:高清显示单路视频或者同时观察多路监控情况. 文中系统只提供了单路.2x2(2行2列共4路).8路(4行4列布局,从左上角算起,有个核心显 ...

  4. 个人经验 - Android的RelativeLayout布局的layout_height属性设置为wrap_content时的坑

    Android的RelativeLayout布局的layout_height属性设置为wrap_content时的坑: 此坑出现的条件: 1.RelativeLayout布局的layout_heigh ...

  5. 读pomelo的教程-2

    下面从头到尾记录chat demo的Login的过程 client:点击login按钮,取得username和rid两个值 $("#login").click(function() ...

  6. WCF启用Session

    1 服务类添加ASPNETSESSION兼容标记 [System.ServiceModel.Activation.AspNetCompatibilityRequirements(Requirement ...

  7. POJ 1004 解题报告

    1.题目描述: http://poj.org/problem?id=1004 2.解题过程 这个题目咋一看很简单,虽然最终要解出来的确也不难,但是还是稍微有些小把戏在里面,其中最大的把戏就是float ...

  8. vi--文本编辑常用快捷键之光标移动

    再来一发! 上一篇关于vi/vim的文章中,主要介绍了文本的复制粘贴删除替换等操作,在慢慢的适应vim的过程中,我发现有很多时间实际上是浪费在移动光标上的,特别是行内移动光标.这篇文章就主要是介绍vi ...

  9. 一站式Hadoop&Spark云计算分布式大数据和Android&HTML5移动互联网解决方案课程(Hadoop、Spark、Android、HTML5)V2的第一门课程

    Hadoop是云计算的事实标准软件框架,是云计算理念.机制和商业化的具体实现,是整个云计算技术学习中公认的核心和最具有价值内容. 如何从企业级开发实战的角度开始,在实际企业级动手操作中深入浅出并循序渐 ...

  10. 总结的Ubuntu的若干小知识

    一.默认开机直接进入到Ubuntu命令行界面 安装Ubuntu后,开机会默认进入到图形界面,如果不喜欢图形界面,可以通过修改配置,直接进入命令行界面,还行节省100多兆的内存空间.具体方法如下: 修改 ...