总结Flex与浏览器交互

在用flex做Web应用时为了扩展应用程序功能，势必会更多的同浏览器进行交互，这样就会用到下面介绍的知识
1、在Flex中实现URL 跳转(使用flash.net.navigateToURL()方法如：)
   

[c-sharp]  view plain copy

1. /* 
2.      * param1: 要跳转的URL 
3.      * param2: 跳转方式 _blank /_self 
4.      */  
5.     navigateToURL(new URLRequest("http://blog.csdn.net/xingjunli"),"_blank");  

2、使用FlashVars传替换参数（使用Application.application.parameters属性）
    页面嵌入SWF文件代码（我们可以通过JS动态来设置FlashVars信息已达到数据交互的目的）
             

[c-sharp]  view plain copy

1. <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%" id="mySwf">  
2.                 <param name="movie" value="main.swf" />  
3.                 <param name="quality" value="high" />  
4.                 <param name="bgcolor" value="#869ca7" />  
5.                 <param name="allowScriptAccess" value="sameDomain" />  
6.         <param name="FlashVars" value="UserName=Andy_liu&Age=18&Address=HongKong" />  
7.             </object>  

        Flex中获取参数代码:
           

[c-sharp]  view plain copy

1. private function onFlashVars(e:MouseEvent):void //获取页面参数  
2.         {  
3.             var parameters:Object = Application.application.parameters;  
4.             labURL.text = Application.application.url.toString();            // http://localhost:8889/main.swf  
5.             var param1:String = parameters.UserName;                    // Andy_liu  
6.             var param2:int = parseInt(parameters.Age);                    // 18  
7.             var param3:String = parameters.Address;                    // HongKong  
8.             /* 
9.             txtParam1.text = param1; 
10.             txtParam2.text = String(param2); 
11.             txtParam3.text = param3; 
12.             */  
13.              
14.         }  

3、在Flex中调用JavaScript函数
    先在页面中完成js function(注在Flex中只能调用当前页面引入的JS函数)
   

[c-sharp]  view plain copy

1. function ShowUserInfo(name,age,address)  
2.      {  
3.         alert("Name:" + name+"/n" + "Age:" + age + "/n" +"Address"+address);  
4.         return "Call Successful!"  
5.      }  

     Flex中调用方法并获取JS function返回值（ 使用ExternalInterface.call()方法）：
   

[c-sharp]  view plain copy

1. private function onCallJS(e:MouseEvent):void  
2.     {  
3.         /* 
4.          * param1:当前页JS function 方法名 
5.          * param...传递的参数0-N个 
6.          */  
7.         var resultValue:String = ExternalInterface.call("ShowUserInfo",txtParam1.text,txtParam2.text,txtParam3.text);  
8.         //resultValue = Call Successful!  
9.     }  

4、在JavaScript中调用ActionScript函数 
    页面中调用的JS 函数
   

[c-sharp]  view plain copy

1. function CallFlexMethod()  
2.      {  
3.         var swf="mySwf";  
4.         var container;  
5.         //alert(navigator.appName);  
6.         if(navigator.appName.indexOf("Microsoft")>=0)  
7.         {  
8.             container = document;  
9.         }  
10.         else  
11.         {  
12.             container = window;  
13.         }  
14.         container[swf].flexFunction1();                    //无参方法  
15.         container[swf].flexFunction2("myHtmlRequest!");//参数传递方法  
16.         alert(container[swf].flexFunction3());            //含返回值方法  
17.      }  

     Flex中注册和调用执行的方法：
     

[c-sharp]  view plain copy

1. //重要必须在Flex中执行如下注册 才能在JS中调用  
2.     private function registerCallBacks():void  
3.     {  
4.         ExternalInterface.addCallback("flexFunction1",jsCallBack1);  
5.         ExternalInterface.addCallback("flexFunction2",jsCallBack2);  
6.         ExternalInterface.addCallback("flexFunction3",jsCallBack3);  
7.     }  
8.     private function jsCallBack1():void  
9.     {  
10.         Alert.show("Call First Flex Method!");  
11.     }  
12.     private function jsCallBack2(params:*):void  
13.     {  
14.         Alert.show("Call Method2:" + String(params));  
15.     }  
16.     private function jsCallBack3():String  
17.     {  
18.         return Math.random().toString();     
19.     }  

5、BrowserManager管理组件应用
     BrowserManager 是一个 Singleton 管理器，用于充当浏览器和应用程序之间的代理。使用它可以访问浏览器地址栏中的 URL，这与访问 JavaScript 中的 document.location 属性类似。当 url 属性发生更改时调度这些事件。然后侦听器可以响应、更改该 URL 或阻止其它对象获取此事件。 
      获得bm实例：
    

[c-sharp]  view plain copy

1. private var bm:IBrowserManager = BrowserManager.getInstance();  

      a、获取URL传递的参数：
   

[c-sharp]  view plain copy

1. private function getBrowserValue():void  
2.     {  
3.         //URL = "http://localhost/browser/main.html#name=peter;age=25;address=shenzhen china"  
4.         var o:Object = URLUtil.stringToObject(bm.fragment);  
5.         txtURLName.text = o.name;            // peter  
6.         txtURLAge.text = o.age;                // 25  
7.         txtURLAddress.text = o.address;        // shenzhen china  
8.     }  

    b、获取浏览器信息(请求URL：“http://localhost:8889/main.html#name=peter;age=25;address=shenzhen%20china”)
       

[c-sharp]  view plain copy

1. private function onBrowserManager(e:MouseEvent):void  
2.         {  
3.             txtBMOutPut.text += "Full URL: /n" + bm.url + "/n/n";  
4.             txtBMOutPut.text += "Base URL: /n" + bm.base + "/n/n";  
5.             txtBMOutPut.text += "URL Fragment URL: /n" + bm.fragment + "/n-----------/n";  
6.              
7.             var o:Object = URLUtil.stringToObject(bm.fragment);  
8.             txtBMOutPut.text += "Object: /n" + ObjectUtil.toString(o) + "/n/n";  
9.             txtBMOutPut.text += "Name: /n" + o.name + "/n/n";  
10.             txtBMOutPut.text += "Age: /n" + o.age + "/n/n";  
11.             txtBMOutPut.text += "Address: /n" + o.address + "/n-----------/n";  
12.              
13.             txtBMOutPut.text += "URL Port: /n" + URLUtil.getPort(bm.url) + "/n/n";  
14.             txtBMOutPut.text += "URL Protocol: /n" + URLUtil.getProtocol(bm.url) + "/n/n";  
15.             txtBMOutPut.text += "URL Server: /n" + URLUtil.getServerName(bm.url) + "/n/n";  
16.             txtBMOutPut.text += "URL Server with Port: /n" + URLUtil.getServerNameWithPort(bm.url) + "/n-----------/n";  
17.             /* 执行结果: 
18.             Full URL: 
19.             http://localhost:8889/main.html#name=peter;age=25;address=shenzhen%20china 
20.             Base URL: 
21.             http://localhost:8889/main.html 
22.             URL Fragment URL: 
23.             name=peter;age=25;address=shenzhen%20china 
24.             ----------- 
25.             Object: 
26.             (Object)#0 
27.               address = "shenzhen china" 
28.               age = 25 
29.               name = "peter" 
30.             Name: 
31.             peter 
32.             Age: 
33.             25 
34.             Address: 
35.             shenzhen china 
36.             ----------- 
37.             URL Port: 
38.             8889 
39.             URL Protocol: 
40.             http 
41.             URL Server: 
42.             localhost 
43.             URL Server with Port: 
44.             localhost:8889 
45.             ----------- 
46.             */  
47.         }  

        c、BrowserManager还包含其它一些浏览器的扩展方法如：bm.setTitle("新标题：正在培训!")修改页面标题等...参考 http://livedocs.adobe.com/flex/3/html/help.html?content=deep_linking_3.html  
6、在Flex中通过实现mx.managers.IHistoryManagerClinet接口来实现自定义历史记录管理器
 自定义textInput
 

[c-sharp]  view plain copy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <mx:TextInput xmlns:mx="http://www.adobe.com/2006/mxml" text="Change Me!" implements="mx.managers.IHistoryManagerClient"  
3.   creationComplete="mx.managers.HistoryManager.register(this);" change="textChanged(event)">  
4.     <mx:Script>  
5.         <!--[CDATA[  
6.             import mx.managers.HistoryManager;  
7.             private function textChanged(e:Event):void  
8.             {  
9.                 HistoryManager.save();  
10.             }  
11.             public function saveState():Object  
12.             {  
13.                 return {text:text};  
14.             }  
15.             public function loadState(state:Object):void  
16.             {  
17.                 var newState:String = state?state.text:"";  
18.                 if(newState != text)  
19.                 {  
20.                     text = unescape(newState);  
21.                 }  
22.             }  
23.         ]]-->  
24.     </mx:Script>  
25. </mx:TextInput>  

 当我们在使用上面自定义的TextInput时会发现在浏览器URL中会动态创建修入如这样的一些信息“#app=a4e4&8211-text=asdfasdfasdfsd%20”故FLEX通过浏览器URL记录SWF文件中组件的变化已实现保存历史记录数据已实现历史记录管理！

转载自：http://blog.csdn.net/xingjunli/article/details/5165881