2008/10/20

使用 FABridge 來呼叫 Flex App 內的函式

FABridge 介紹:
透過 FABridge 可以讓 JavaScript 幾乎可以完全存取 FlexApp 內的函式以及變數,讓 Flex 與 JavaScript 的溝通變得相當簡單,不用額外透過 ExternalInterface 來定義要存取的函式。
最極端的使用 FABRidge 就是在 Flex 拉好 UI,並透過 JavaScript 來控制這些 UI,可以省掉編譯的冗長等待,並且讓只會 JavaScript 的開發人員也可以開發 FlexApp。但缺點是工具不支援,以及 Client 端必須啟用 JavaScript。

FABridge 安裝:
Flex 端的設定:

MyMain.xml
<bridge:fabridge id="externalBridge" rootobject="{this}" bridge="bridge.*" />

將 C:\Program Files\Flex Builder 3\sdks\3.0.0\frameworks\javascript\fabridge\src\bridge\FABridge.as 複製到 src 的 bridge/FABridge.as


HTML 端的設定
將 C:\Program Files\Flex Builder 3\sdks\3.0.0\frameworks\javascript\fabridge\src\bridge\FABridge.js 複製到 html-template/ 資料夾。

在 html-template/index.template.html 中加入

<script type="text/javascript" src="FABridge.js"></script>

<script type="text/javascript">

window.onload = function() {
FABridge.addInitializationCallback('flash', initCallback); //初始化,等到 FlexApp 初始化完成時會去呼叫 initCallBack。

};
function initCallback() {
app = FABridge.flash.root(); //取出 MyMain

facade = app.getFacade(); //取出 MyMain 內的 facade,注意存取變數必須以 getter 方法取出。 facade 在 MyMain 中只是定義為 public var facade:IFacade; , 而不是 public function getFacade();
//alert('facade : ' + facade);
app.addEventListener('loginSucceed', function() { //取得登入結果事件,並接收登入資訊

userProxy = facade.getUserProxy();
//alert('userProxy : ' + userProxy);
userToken = userProxy.getUserToken();

//alert('userProxy.userToken : ' + userToken);
}