アクセシビリティ
デベロッパーリソース

目次

SWFObjectを使用したJavaScript Flash Playerの検出と埋め込み

SWFObjectの仕組み

SWFObjectは簡単に使用できます。swfobject.jsというJavaScriptファイルをインクルードし、Macromedia Flashコンテンツを埋め込むためにページ内でJavaScriptを少し使用するだけです。

次の例は、SWFの埋め込みに必要な最少限のコードです。

<script type="text/javascript" src="swfobject.js"></script>

<div id="flashcontent">
このテキストはFlashコンテンツで置き換えられます。
</div>

<script type="text/javascript">
var so = new SWFObject("movie.swf", "mymovie", "200", "100", "7", "#336699");  
so.write("flashcontent");
</script>

次の節で、このコードの動作を説明します。

SWFの保持

<div id="flashcontent">[...]</div>

この部分はSWFを保持するHTML要素を作成します。この「ホルダ」要素内のコンテンツはFlashコンテンツによって置き換えられるので、Flash Playerがインストールされている場合、この要素内のコンテンツが表示されることはありません。

代替コンテンツには、Flash Playerをインストールしていないユーザへのメッセージや、代わりのHTMLコンテンツなど、HTMLと画像を組み合わせたものを使用できます。この機能を利用すると、さらに、検索エンジンに代替コンテンツのインデックスを作成させることができます。SWFObjectが検索エンジンでのランキングをどのように向上するかについて詳しくは、Flash and search engine optimization*に関する私のブログ記事をご覧ください。

パラメータを渡す

var so = new SWFObject(swf, id, 幅, 高さ, バージョン, 背景色);

このコードは、新しいSWFObjectファイルを作成して次の必須パラメータを渡します。

  • swf:SWFファイルのパスと名前。
  • id:objectまたはembedタグのID。embedタグにも、swliveconnectを利用するSWFファイルのname属性としてこの値が設定されます。swliveconnectはJavaScriptのやり取りに使用されるもので、Flash 8ではExternalInterfaceに替わっています。
  • 幅:SWFの幅。
  • 高さ:SWFの高さ。
  • バージョン:Flashコンテンツに必要なPlayerのバージョン。この値には、majorVersion.minorVersion.revision形式の文字列(「6.0.65」など)を指定することも、メジャーバージョンのみ(「6」など)を指定することもできます。
  • 背景色:SWFの背景色を指定する16進数値。

オプションのパラメータには次のものがあります。

  • useExpressInstall:Express Install機能を使用してアップグレードするには、この値をtrueにします。
  • quality:Flashコンテンツを再生するときの画質です。何も指定しない場合のデフォルトはhighです。
  • xiRedirectUrl:Express Installアップグレードが完了したユーザをリダイレクトするには、代替URLをここで指定します。
  • redirectUrl:適切なバージョンのFlash Playerを持っていないユーザをリダイレクトするには、このパラメータを使用します。
  • detectKey:これは検出をスキップするときにSWFObjectが受け取るURL変数名です。デフォルトはdetectflashです。

    例えば、Flash検出をスキップして、単純にWebページにSWFを書き込む場合は、Flashコンテンツを含んでいるドキュメントのURLに?detectflash=falseを追加します。

Flashコンテンツのページへの書き込み

so.write("flashcontent");

このコードにより、SWFObjectスクリプトが指定されたHTML要素内のFlashコンテンツを置き換えて、コンテンツをページに書き込みます。ただし、ユーザのシステムに適切なバージョンのPlayerがインストールされていることが前提になります。

舞台裏での検出作業

SWFObjectはHTMLドキュメントのバックグラウンドで動作します。SWFObjectを使用するページを作成するときは、まずFlash以外の代替コンテンツを作成します。SWFをインクルードしていないページが正しく動作するようになったら、代替コンテンツをFlashコンテンツと置き換える簡単なJavaScriptコードスニペットを追加します。これにより、検索エンジンでは代替コンテンツのインデックスが作成され、Flash PlayerをインストールしていないユーザにもHTMLページが正常に表示されます。

アップグレードするように指示するかどうかはあなた次第です。代替コンテンツでも十分目的を達することができる場合は、ユーザにFlashコンテンツを見逃していることを知らせる必要はないかもしれません。

SWFObjectは、Microsoft Internet Explorer 5、5.5、6、Netscape 7、8、Firefox、Mozilla、OperaなどWindowsで現在使用されているすべてのWebブラウザで動作します。Mac OSでは、Internet Explorer 5.2、Safari、Firefox、Netscape 6、7、Mozilla、Opera 7.5+で動作します。将来においても、SWFObjectは引き続き同様に動作するでしょう。

また、SWFObjectを使用すると、ユーザは最初にFlashコンテンツを「アクティブ化」しなくてもFlashコンテンツを操作できます。Internet Explorerに関するEolas社の特許訴訟と最近のInternet Explorerのアクティブコンテンツパッチについて詳しくは、アクティブコンテンツデベロッパーセンターをご覧ください。

SWFObjectに目的のバージョンを文字列値として渡すだけで、Flash Player のマイナーバージョンなどを検出できます。次の例は、Flash Player v.6.0 r65(すなわち6,0,65,0)を検出する場合のコードです。

var so = new SWFObject("movie.swf", "mymovie", "200", "100", "6.0.65", "#336699");

SWFObjectのスキップ

SWFObjectに組み込まれているプラグイン検出をスキップできます。ユーザのシステムで何らかの理由でプラグインの検出が失敗した場合、SWFObjectに組み込まれている検出機能を無効にして、必ずFlashコンテンツがページに書き込まれるように迂回用のリンクをインクルードできます。

それには、Flashコンテンツを含んでいるページへのリンクに、detectflashというURL変数をインクルードしてfalseに設定するだけです。次に、リンクの例を示します。

<a href="mypage.html?detectflash=false">迂回用リンク</a>