Flash と JavaScript の連携

Flash から JavaScript の関数を呼んだり、 JavaScript から Flash の関数を呼んだりしたいことがかなりあって、どんな方法があるのか調べたときのメモ。
ただ単に呼び出す方法が分かっても、JavaScript と Flash のロードし終わるタイミングなんかもあって色々と厄介だったのでその辺の回避方法もついでに書いておく。

Call JavaScript Function from Flash

まずは Flash から JavaScript 関数を呼び出す方法。
これはとてつもなく簡単で、 Flash の AsctionScript に以下のように書けば問題なく呼び出せる。

getURL('javascript: myjsfunction("hello");');

Call Flash Function from JavaScript

次に Flash 関数を JavaScript から呼び出す方法だけど、これはいくつか方法があるらしいんだけど、今一番メジャーなのは ExternalInterface を使う方法だと思う。

Action Script

ここでは JavaScript が myasfunction という名の関数を呼んだ際に、 ActionScript 内の asfunction を呼び出すようにする例。

import flash.external.ExternalInterface;

function asfunction(myparam)
{
  return "Hello " + myparam;
}

ExternalInterface.addCallback("myasfunction", this, asfunction); 

HTML

HTML を書く際のポイントは object タグに id を、 embed タグには name を指定して JavaScript から Flash オブジェクトを参照できるようにしておく点。
なぜこうしないといけないのかはいまいち不明。

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
  codebase=
"http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0"
  id="flashapp" width="420" height="360">
  <param name="movie" value="myflashapp.swf"></param>
  <param name="quality" value="high"></param>
  <embed src="myflashapp.swf" width="420" height="360" name="flashapp" quality="high"
    pluginspage=
"http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash">
  </embed>
</object>

JavaScript

最後に JavaScript 。先ほどの HTML から Flash への参照を取得して、 ActionScript の Callback 関数を呼び出す。
これで Hello Masaki とダイアログが上がれば成功だけど、めんどくさいから試してない。多分大丈夫。

if( navigator.appName.indexOf("Microsoft") != -1 )
{
  flashobj = window.flashapp;
}
else
{
  flashobj = window.document.flashapp;
}

alert(flashobj.myasfunction("Masaki"));

注意点

単純にこれらの方法で通信できるんだけど、 HTML ロード時に Flash がロードし終わってないのに、 JavaScript が Flash にアクセスしてしまったり、その逆が起きたりして、結構はまった。
その時の回避策として行ったのが、
1) Flash の object を style display:none にしておき
2) body onload 時に初めて display:block にして Flash を読み込ます
3) Flash ムービーの中で、 ExternalInterface の実装が完了したあたりで、 JavaScript を呼び出して知らせる
4) この時点でもし JavaScript を実行したいならする
という風にすると、お互い確実にロードし終わってるので安全です。
まあ、もっと普通のやり方あるのかもしれないけど。

ちなみに、 EnjoiFLV 作るときに Flash との連携もしたんだけど、それは次回ということで。

コメント