JavaScript에서 Adobe Flex/ActionScript 메서드를 호출 하시겠습니까?

JavaScript가 Flex로 되돌아 갈 수없는 이유를 알아야합니다. JavaScript를 사용하여 특정 비디오 파일을 재생할 프로젝트가 있습니다. /static 접두사를 통해 에셋 파일이로드되는 사용자 정의 MVC 프레임 워크에서 실행됩니다.JavaScript에서 Adobe Flex/ActionScript 메서드를 호출 하시겠습니까?

예는 : http://helloworld/static/swf/movie.swf`

나는 옵션 -static-link-runtime-shared-libraries=true, -use-network=true 및 --debug=true와 mxmlc 바이너리를 사용하여 내 플렉스 응용 프로그램을 컴파일합니다.

플렉스

<?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 FABridge와 함께 가기로 결정

<!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에서 제공하는 링크에서 솔루션의 기본을 보여줍니다.

플렉스 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>

내가 (빈-debug 폴더를 추가해야한다고 통지하십시오, 플렉스 4.1을 테스트 C : \ flexworkspaces 프로젝트 \ \ bin- 디버그)를 플래시 보안 앱 (http://www.macromedia.com/support/documentation/en/flashplayer/help/settings_manager04.htmlconfiguration)에 추가하십시오.이 인터넷 URL은 사실 Flex 로컬 구성을 수정하는 앱입니다.

로그를 Firebug 콘솔에 표시 할 수 있습니다.

출처

2013-08-23 01:01:43

-1

. 다른 사람들은 실제 사례를 듣고 있습니다.

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 메서드를 호출 하시겠습니까?

답변

관련 문제