從JavaScript調用Adobe Flex/ActionScript方法？

我需要知道爲什麼JavaScript無法與Flex交談。我有一個項目將使用JavaScript來播放給定的視頻文件。它運行在一個自定義的MVC框架中，資源文件通過前綴/static加載。從JavaScript調用Adobe Flex/ActionScript方法？

例：http://helloworld/static/swf/movie.swf`

我編譯使用mxmlc二進制的選項-static-link-runtime-shared-libraries=true，-use-network=true和--debug=true我的Flex應用程序。

的Flex

<?xml version="1.0" encoding="utf-8"?> 
<s:Application 
    xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:s="library://ns.adobe.com/flex/spark" 
    xmlns:mx="library://ns.adobe.com/flex/mx" 
    creationComplete="init()"> 
    <fx:Script> 
     <![CDATA[ 
      import mx.controls.Alert; 
      import flash.external.ExternalInterface; 
      private function init():void { 
       log("Logging..."); 
       if (ExternalInterface.available) { 
        ExternalInterface.call("HelloWorld.initFlash"); 
        ExternalInterface.addCallback("playVideo", playVideo); 
       } 
      } 
      public function playVideo():void { 
       log("Playing video..."); 
      } 
      public function log(message:String):void { 
       if (ExternalInterface.available) { 
        ExternalInterface.call(
         "function log(msg){ if (window.console) { console.log(msg); } }", 
         message); 
       } 
      } 
     ]]> 
    </fx:Script> 
    <s:Panel id="myPanel" title="Hello World" x="20" y="20"> 
     <s:layout> 
      <s:HorizontalLayout 
       paddingLeft="10" 
       paddingRight="10" 
       paddingTop="10" 
       paddingBottom="10" 
       gap="5" /> 
     </s:layout>  
    </s:Panel> 
</s:Application>

HTML

<!DOCTYPE HTML> 
<html lang="en-US"> 
    <head> 
     <meta charset="UTF-8"> 
     <title>Hello World</title> 
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> 
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script> 
     <script type="text/javascript"> 
      $(function(){ 
       var swfVersionStr  = "10.1.0"; 
       var xiSwfUrlStr   = "playerProductInstall.swf"; 
       var flashvars   = {}; 
       var params    = {}; 
       var attributes   = {}; 
       params.allowscriptaccess = "sameDomain"; 
       params.quality   = "high"; 
       params.bgcolor   = "#FFFFFF"; 
       params.allowfullscreen = "true"; 
       attributes.id   = "HelloWorld"; 
       attributes.name   = "HelloWorld"; 
       attributes.align   = "left"; 
       swfobject.embedSWF( 
        "HelloWorld.swf", 
        "flash-content", 
        "100%", "100%", 
        swfVersionStr, xiSwfUrlStr, flashvars, params, attributes); 
       HelloWorld = function(){ 
        return { 
         initFlash : function() { 
          console.log("Called from Flex..."); 
          console.log($("#HelloWorld").get(0).playVideo("be6336f9-280a-4b1f-a6bc-78246128259d")); 
         } 
        } 
       }(); 
      }); 
     </script> 
     <style type="text/css"> 
      #flash-content-container { 
       width : 400px; 
       height : 300px; 
      } 
     </style> 
    </head> 
    <body> 
     <div id="layout"> 
      <div id="header"><h1>Hello World</h1></div> 
      <div id="flash-content-container"> 
       <div id="flash-content"></div> 
      </div> 
     </div> 
    </body> 
</html>

輸出

Logging... 
Called from Flex...

來源

2011-09-22 ezraspectre

你看這篇文章？ http://livedocs.adobe.com/flex/3/html/help.html?content=passingarguments_5.html – Joe

我想我已經查看了ExternalInterface上的每個參考頁面，並嘗試了這些示例，但無法正常工作。對其他資源可能有所幫助的任何建議。在我的代碼中，Flex可以與JavaScript交談，但不是相反 – ezraspectre

我有同樣的問題，在克里斯Cashwell提供的鏈接，它顯示瞭解決方案的基礎。

Flex的MXML

<?xml version="1.0" encoding="utf-8"?> 
    <s:Application 
     xmlns:fx="http://ns.adobe.com/mxml/2009" 
     xmlns:s="library://ns.adobe.com/flex/spark" 
     xmlns:mx="library://ns.adobe.com/flex/mx" 
     creationComplete="init()"> 
     <fx:Script> 
      <![CDATA[ 
       import mx.controls.Alert; 
       import flash.external.ExternalInterface; 
       private function init():void { 
        consoleLog("Hello World"); 
        try 
        { 
         Security.allowDomain("*"); //I need to add this. 
         ExternalInterface.marshallExceptions = true; 
         ExternalInterface.addCallback("sendAlert",sendAlert); 
         ExternalInterface.call("initCallBack"); 
        } catch (error:Error) { 
         consoleLog("Error in ExternalInterface");       
         consoleLog("Error" + error.message); 
        } 
       } 
       public function sendAlert(s:String):void 
       { 
        Alert.show(s); 
       } 
       public function consoleLog(message:String):void { 
        if (ExternalInterface.available) { 
         ExternalInterface.call(
          "function log(msg){ if (window.console) { console.log(msg); } }", 
message); 
        } 
       } 
      ]]> 
     </fx:Script> 
     <s:Panel id="panel1" title="Hello World" x="20" y="20"> 
      <s:layout> 
       <s:HorizontalLayout 
        paddingLeft="10" 
        paddingRight="10" 
        paddingTop="10" 
        paddingBottom="10" 
        gap="5" /> 
      </s:layout> 
      <s:TextArea id="textarea1" 
       width="300" height="100" 
       text="Hello World" />  
     </s:Panel> 
    </s:Application>

HTML

<!DOCTYPE HTML> 
<html lang="en-US"> 
    <head> 
     <meta charset="UTF-8"> 
     <title>Hello World</title> 
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> 
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script> 
     <script type="text/javascript"> 
      var flexApp; 
      function initCallBack() { 
       flexApp = document.getElementById("HelloWorldFlex"); 
       if (flexApp != undefined) { 
        try { 
         flexApp.sendAlert("Hello World"); 
        } catch(err) { 
         console.log("There was an error on the flex callback."); 
         console.log(err);  
        } 
       } else { 
        console.log("The flex object does not exist yet"); 
       } 
       return; 
      } 
      $(function(){ 
       HelloWorld = function(){ 
        return { 
         init : function() { 
          var swfVersionStr  = "10.1.0"; 
          var xiSwfUrlStr   = "playerProductInstall.swf"; 
          var flashvars   = { 
           bridgeName : "flex", 
          }; 
          var params    = {}; 
          var attributes   = {}; 
          params.allowscriptaccess = "always"; 
          params.quality   = "high"; 
          params.bgcolor   = "#FFFFFF"; 
          params.allowfullscreen = "true"; 
          attributes.id   = "HelloWorldFlex"; 
          attributes.name   = "HelloWorldFlex"; 
          attributes.align   = "left"; 
          swfobject.embedSWF( 
           "HelloWorld.swf", 
           "flash-content", 
           "100%", "100%", 
           swfVersionStr, xiSwfUrlStr, flashvars, params, attributes); 

         } 
        } 
       }(); 
       HelloWorld.init(); 
      }); 
     </script> 
     <style type="text/css"> 
      #flash-content-container { 
       width : 400px; 
       height : 300px; 
      } 
     </style> 
    </head> 
    <body> 
     <div id="layout"> 
      <div id="header"><h1>Hello World</h1></div> 
      <div id="flash-content-container"> 
       <div id="flash-content"></div> 
      </div> 
     </div> 
    </body>

我測試的Flex 4.1，請注意，我不得不添加的bin-debug文件夾（C：\ flexworkspaces \項目\ bin-調試）到Flash安全應用程序（http://www.macromedia.com/support/documentation/en/flashplayer/help/settings_manager04.htmlconfiguration）請注意，該互聯網URL實際上是一個修改Flex本地配置的應用程序。

日誌可以顯示在Firebug控制檯中。

來源

2013-08-23 01:01:43

-1

決定去FABridge。對於其他人繼承一個工作的例子。

MXML

<?xml version="1.0" encoding="utf-8"?> 
<s:Application 
    xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:s="library://ns.adobe.com/flex/spark" 
    xmlns:mx="library://ns.adobe.com/flex/mx" 
    xmlns:bridge="bridge.*" 
    creationComplete="init()"> 
    <fx:Declarations> 
     <bridge:FABridge bridgeName="flex" /> 
    </fx:Declarations> 
    <fx:Script> 
     <![CDATA[ 
      import mx.controls.Alert; 
      import flash.external.ExternalInterface; 
      private function init():void { 
       consoleLog("Hello World"); 
      } 
      public function sendAlert(s:String):void 
      { 
       Alert.show(s); 
      } 
      public function consoleLog(message:String):void { 
       if (ExternalInterface.available) { 
        ExternalInterface.call(
         "function log(msg){ if (window.console) { console.log(msg); } }", 
         message); 
       } 
      } 
     ]]> 
    </fx:Script> 
    <s:Panel id="panel1" title="Hello World" x="20" y="20"> 
     <s:layout> 
      <s:HorizontalLayout 
       paddingLeft="10" 
       paddingRight="10" 
       paddingTop="10" 
       paddingBottom="10" 
       gap="5" /> 
     </s:layout> 
     <s:TextArea id="textarea1" 
      width="300" height="100" 
      text="Hello World" />  
    </s:Panel> 
</s:Application>

HTML

<!DOCTYPE HTML> 
<html lang="en-US"> 
    <head> 
     <meta charset="UTF-8"> 
     <title>Hello World</title> 
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> 
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script> 
     <script type="text/javascript" src="bridge/FABridge.js"></script> 
     <script type="text/javascript"> 
      var flexApp; 
      var initCallback = function() { 
       flexApp = FABridge.flex.root(); 
       var textarea1 = flexApp.getTextarea1(); 
       textarea1.setText("Hello World (Updated)"); 
       flexApp.sendAlert("Hello World"); 
       return; 
      } 
      $(function(){ 
       HelloWorld = function(){ 
        return { 
         init : function() { 
          var swfVersionStr  = "10.1.0"; 
          var xiSwfUrlStr   = "playerProductInstall.swf"; 
          var flashvars   = { 
           bridgeName : "flex", 
          }; 
          var params    = {}; 
          var attributes   = {}; 
          params.allowscriptaccess = "sameDomain"; 
          params.quality   = "high"; 
          params.bgcolor   = "#FFFFFF"; 
          params.allowfullscreen = "true"; 
          attributes.id   = "HelloWorld"; 
          attributes.name   = "HelloWorld"; 
          attributes.align   = "left"; 
          swfobject.embedSWF( 
           "HelloWorld.swf", 
           "flash-content", 
           "100%", "100%", 
           swfVersionStr, xiSwfUrlStr, flashvars, params, attributes); 
          FABridge.addInitializationCallback("flex", initCallback); 
         } 
        } 
       }(); 
       HelloWorld.init(); 
      }); 
     </script> 
     <style type="text/css"> 
      #flash-content-container { 
       width : 400px; 
       height : 300px; 
      } 
     </style> 
    </head> 
    <body> 
     <div id="layout"> 
      <div id="header"><h1>Hello World</h1></div> 
      <div id="flash-content-container"> 
       <div id="flash-content"></div> 
      </div> 
     </div> 
    </body> 
</html>

來源

2011-09-23 03:34:39 ezraspectre

從JavaScript調用Adobe Flex/ActionScript方法？

回答

相關問題