Flex アプリケーションとのデータの交換について -- Flex 2.01

一般に Flex アプリケーションは、より大きな Web アプリケーションの内部に存在します。この Web アプリケーションでは、セキュリティや状態管理から Web サイト全体の外観と操作性までのすべてを制御します。このシナリオでは、Flex アプリケーションが周囲の環境と通信し、より大きな Web アプリケーションと緊密に統合されることが重要です。Flex アプリケーションが周囲の環境と通信できるようにすることにより、AJAX などの他の技術との統合も可能になります。

多くの場合、Flex アプリケーションは、ブラウザのラッパー内でロードされます。このラッパーは多くの場合、Flex アプリケーションとのやり取りが可能な JavaScript またはその他のクライアント側ロジックを含むことができる、HTML ページです。ラッパーの詳細については、Flex 2 アプリケーションの構築および展開ガイドのラッパーの作成を参照してください。

Flex アプリケーションが周囲の環境と通信する方法は複数あります。必要な統合のタイプに応じて、flashVars プロパティ、クエリ文字列パラメータ、navigateToURL() メソッド、および ExternalInterface クラスの任意の組み合わせを使用できます。

要求データを Flex アプリケーションに渡すには、クエリ文字列パラメータを使用し、Application.application.parameters または LoaderConfig.parameters オブジェクトを使用して値にアクセスします。データをラッパー内の flashVars プロパティとして渡し、Application および LoaderConfig オブジェクトの parameters プロパティを使用して値にアクセスすることもできます。詳細については、flashVars の使用を参照してください。これらの方法を使用すると、再コンパイルをトリガせずに Flex アプリケーションをパーソナライズできます。

Flex アプリケーションのメソッドを呼び出すには、ExternalInterface API のメソッドを使用します。また、その逆も可能です。addCallback() メソッドは、Flex アプリケーションのメソッドをラッパーに対して公開します。call() メソッドは、ラッパー内のメソッドを呼び出し、結果を返します。ラッパーが HTML の場合は、addCallback() および call() メソッドにより、Flex アプリケーションとホストされブラウザ内で実行されている JavaScript の間で、相互の呼び出しが可能になります。詳細については、ExternalInterface API についてを参照してください。

新しいブラウザウィンドウを開いたり、新しい場所に移動したりする場合には、navigateToURL() グローバル関数を使用します。このメソッドは、ExternalInterface API の一部ではありませんが、柔軟性があるので、JavaScript を内部に記述したり、結果の HTML ページで JavaScript 関数を呼び出すことができます。navigateToURL() メソッドは、flash.net パッケージ内のグローバル関数です。

アクセス環境に関する情報

Flex には、ブラウザおよびアプリケーションの動作環境に関する情報を取得するための、いくつかの簡単なメカニズムがあります。Flex アプリケーション内から SWF ファイルへの URL を取得できます。コンテキストルートを取得することもできます。次の例では、SWF ファイルの URL を取得し、URL からホスト名を作成し、コンテキストルートを表示します。コンテキストルートには、@ContextRoot() トークンを使用してアクセスできます。

<?xml version="1.0"?>
<!-- wrapper/GetURLInfo.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="getHostName()">
  <mx:Script><![CDATA[

  [Bindable]
  public var g_HostString:String;
  [Bindable]
  public var g_ContextRoot:String;
  [Bindable]
  public var g_BaseURL:String;
  
  private function getHostName():void {
     g_BaseURL = Application.application.url;
     var pattern1:RegExp = new RegExp("http://[^/]*/");
     if (pattern1.test(g_BaseURL) == true) {
        g_HostString = pattern1.exec(g_BaseURL).toString();
     } else{
        g_HostString = "http://localhost/"
     }   
  }
  ]]></mx:Script>

  <mx:Form>
     <mx:FormItem label="Base URL:">
        <mx:Label text="{g_BaseURL}"/>
     </mx:FormItem>
     <mx:FormItem label="Host Name:">
        <mx:Label text="{g_HostString}"/>
     </mx:FormItem>
     <mx:FormItem label="Context Root:">
        <mx:Label text="@ContextRoot()"/>
     </mx:FormItem>
  </mx:Form>
</mx:Application>

flash.system.Capabilities クラスを使用して、オペレーティングシステム、Player バージョン、および言語などのクライアント情報にアクセスすることもできます。詳細については、Flash ActionScript の使用を参照してください。

ブラウザおよびアプリケーションの環境に関する詳細情報にアクセスするには、ExternalInterface を使用します。詳細については、ExternalInterface API についてを参照してください。

サブトピック

Netscape 接続の有効化

Netscape ブラウザでは、ブラウザと Flex アプリケーションの間で通信できるようにするために、ラッパーの <embed> タグに swliveconnect=true を記述する必要があります。これにより、Flex アプリケーションはページのスクリプト言語 (通常は JavaScript) に接続できます。このパラメータは、Flex アプリケーションのラッパーの <embed> タグに追加します。次を参照してください。

<embed pluginspage='http://www.macromedia.com/go/getflashplayer' 
    width='300' 
    height='100'
    flashvars=''
    src='TitleTest.mxml.swf'
    name='MyApp'
    SWLIVECONNECT='true'
/>

<object> タグは Netscape ブラウザではなく、Microsoft Internet Explorer で使用するため、<object> タグ内で swliveconnect の値を true に設定する必要はありません。

ExternalInterface API について

ExternalInterface API を使用すると、Flex アプリケーションはラッパー内のメソッドを呼び出せるようになり、ラッパーは Flex アプリケーション内の関数を呼び出せるようになります。ExternalInterface API は主に、flash.external パッケージの call() メソッドと addCallback() メソッドで構成されます。

ExternalInterface API は、次のブラウザでサポートされています。

ExternalInterface API を使用したコードを実行する前に、API がブラウザでサポートされていることを確認してください。確認するには、Flex アプリケーションに含まれる ExternalInterface オブジェクトの available プロパティを使用します。available プロパティはブール値であり、ブラウザが ExternalInterface API をサポートする場合は true、サポートしていない場合は false になります。このプロパティは読み取り専用です。

次の例では、available を使用して、ExternalInterface API がサポートされているかを検出してから、クラスを使用するメソッドを実行します。

<?xml version="1.0"?>
<!-- wrapper/CheckExternalInterface.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="checkEI()">
  <mx:Script><![CDATA[
     [Bindable]
     public var eiStatus:String;

     private function checkEI():void {
           eiStatus = ExternalInterface.available.toString();
     }

  ]]></mx:Script>
  
  <mx:Label id="l1" text="{eiStatus}"/>

</mx:Application>

ExternalInterface API を使用するには、ブラウザが一定のバージョン要件を満たす必要があるだけでなく、ブラウザで JavaScript が有効になっている必要もあります。JavaScript が無効になっているブラウザは、HTML ページで <noscript> タグを使用して操作できます。詳細については、JavaScript が無効なブラウザの処理を参照してください。

available プロパティは、ブラウザのバージョンと製造元に基づいて、ブラウザが ExternalInterface API をサポートするかどうかのみを判別します。ブラウザで JavaScript が無効になっている場合も、available プロパティは true を返します。

ExternalInterface API は、SWF ファイルが実行されているセキュリティサンドボックスによって制限されます。この API を使用できるかどうかは、allowScriptAccess および allowNetworking パラメータで定義されるドメインベースのセキュリティ制限に依存します。allowScriptAccess および allowNetworking パラメータの値は、SWF ファイルのラッパーで設定します。

これらのパラメータの詳細については、Flex 2 アプリケーションの構築および展開ガイドのラッパーの作成を参照してください。