今からはじめるAIRプログラミング(15) シームレス・インストール - AIRランタイムを自動的にインストールさせる

AIRアプリケーションの配布は問題含み

この連載も今回で15回を数える。その大半がAIRアプリを開発するのに必要なプログラミングの話題だったわけだが、今回は少し趣向を変え、作成したAIRアプリケーションの配布に関する話題をお届けしたいと思う。

そもそも、AIRアプリケーションにとって配布は頭の痛い問題だ。

AIRアプリケーションが動作するためには、適切なバージョンのAIRランタイムがクライアントマシン上にインストールされている必要がある。

例えば、あるAIRアプリケーションを使いたいと思っているユーザがいるとしよう。そのユーザが、AIRアプリケーションを自分のマシンにインストールして使用するまでには

まずAIRランタイムをインストールしておく
その上で、WebサイトなどからアプリケーションのAIRファイルをダウンロードする
AIRファイルをダブルクリックしてローカルマシンにインストールする

というプロセスが必要になる。

しかし、もしユーザがAIRランタイムをインストールし忘れた、もしくはそもそもAIRランタイムの存在を知らなかった場合はどうだろう。その場合は、

WebサイトなどからアプリケーションのAIRファイルをダウンロードする
拡張子が「.air」となっている、起動方法が不明のファイルを手に入れた
???

となってしまい、アプリケーションのインストールにつまづいてしまう。

そのユーザがどうしてもそのアプリケーションを使いたいと思い、自分でAIRランタイムの存在を突き止めてインストールしてくれればよいが、それはユーザに多くを求めすぎだろう。というわけで、そのAIRファイルはゴミ箱行きになる可能性が非常に高い。

他にも、AIRアプリが想定しているバージョンよりも古いAIRランタイムがインストールされている場合などには、さらに大きな混乱を招くことは容易に想像できる。

こうした問題を解決するための簡単な仕組みが用意されている。それが今回解説する、「シームレス・インストール」だ。

シームレス・インストールとは?

シームレス・インストールとは、「Webサイト上のAIRアプリケーションへのリンクをクリックすると、そのアプリが必要とするバージョンのAIRランタイムを同時にインストールする」というインストール方法のことだ。

どういった効果があるかは、画像を見ていただければ一目瞭然だ。

AIRランタイムをアンインストールした状態で、Adobe Labsのサンプルギャラリーを訪れてみる。

この画像は、サンプル「MapCache」へのリンクだ。AIRがインストールされていないため、右下に「MapCacheを動作させるにはAIRのセットアップが必要」という趣旨の文章が表示されている。


リンクをクリックすると、AIRランタイムをインストールしていないにもかかわらず、アプリケーションのインストールダイアログが普通に表示される。	そのまま「Install」を押すと、次の画面で「Install Adobe AIR 1.0 Beta 1 (required)」というチェックボックスが表示されている。必須項目なのでチェックを外すことはできない。


その次の画面ではAIRランタイムのライセンスが表示される。ここで「I Agree」を押すと、アプリケーションと一緒にAIRランタイムもインストールされる。	サンプル「MapCache」のインストール後、コントロールパネルの「プログラムの追加と削除」を見ると、AIRランタイムがきちんとインストールされていることがわかる。

そして、AIRランタイムがインストールされた状態で再度サンプルギャラリーを訪れると、先ほど表示されていた「AIRランタイムのセットアップが必要」という文章は消えている

これで、シームレス・インストールの効果はお解りだろう。リンクをクリックしたサイトから全く移動する必要なく、ほんの数回クリックするだけでAIRランタイムを同時にインストールできる上、セキュリティに関する警告が表示され、AIRランタイムのライセンス要項に対する同意も得ることができる。

これほどスムーズにランタイムの配布を行えるシームレス・インストールであるが、この仕組みが動作するためにはFlash Playerのバージョン6以上が必要となる。とはいえ、Flash Playerの普及率を考えると大した制限ではないと言って良いだろう。

シームレス・インストールを自分のWebサイトでも使えるようにするには

これほど便利で、ユーザにストレスを感じさせないシームレス・インストールがあるからには、自分のWebサイトでもぜひ使えるようにしたいと思うのは自然なことだ。

以下にその方法を説明しよう。

シームレス・インストールは、先ほども述べたとおりFlash Player 6以上が必要となる。これは、シームレス・インストールのプロセス全体を「badge.swf」というSWFアプリケーションで行っているからだ。

そのbadge.swfはどこから入手できるかと言うと、AIRのSDKに含まれている。SDKをお持ちでない方はAdobe labs内のこちらのページからダウンロードしていただきたい。

SDKを展開し、「air_b1_win_sdk_061107/samples/badge」ディレクトリを見るとbadge.swfファイルが見つかるはずだ。このSWFファイルと、配布したいAIRファイルを用意すれば準備完了だ。

badge.swfファイルを使用するには、Webページに以下のようなタグを挿入してbatch.swfを埋め込む。

<object id="badge"
  width="217" height="180" align="middle"
  codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0"
  classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000">

  <param name="allowScriptAccess" value="all"/>
  <!-- badge.swfへのパスを指定する -->
  <param name="movie" value="badge.swf"/>
  <param name="quality" value="high"/>
  <param name="bgcolor" value="#FFFFFF"/>
  <!-- この部分(FlashVars)が重要! -->
  <param value="appurl=http://localhost:8080/seamlessinstall/AIRFileSystemExample.air&airversion=1.0.M4&buttoncolor=008811&messagecolor=000000&imageurl=airfilesystemexample.jpg" name="FlashVars"/>
  <!--
    以下のembedタグのsrc属性でbadge.swfファイルへのパスを指定する。
    flashvars属性が重要!
  -->
  <embed
    width="217" height="180" align="middle"
    flashvars="appurl=http://localhost:8080/seamlessinstall/AIRFileSystemExample.air&airversion=1.0.M4&buttoncolor=008811&messagecolor=000000&imageurl=airfilesystemexample.jpg"
    pluginspage="http://www.macromedia.com/go/getflashplayer"
    type="application/x-shockwave-flash"
    allowscriptaccess="all"
    name="badge" bgcolor="#FFFFFF" quality="high" src="badge.swf"/>
</object>

objectタグを認識しないブラウザのために、embedタグと組み合わせて使用している。

このWebページをサーバ上に置き、ブラウザからアクセスすると以下のようなボタンが表示される。

batch.swfを埋め込むコード内でのポイントは、objectタグとembedタグのどちらでも指定している「FlashVars」というパラメータだ。パラメータには、「名前=値&名前=値&…」という形式の文字列を指定する。パラメータに指定できる値は以下の通りだ。

appurl - AIRファイルへのURLを指定する(必須)。試したところ、どうやら相対URLは使用できないようだ
airversion - このアプリケーションが動作するために必要なAIRのバージョンを指定する
buttoncolor - 「Install Now」ボタンの背景色
messagecolor - 「Install Now」ボタンに表示されるメッセージの色

たったこれだけで、シームレス・インストール用のインストールボタンをWebページに表示することができる。

また、badge.swfはソースも公開されており(SDK内のsrc/badge内)、修正することもできる。実際、dobe Labsのサンプルギャラリーに埋め込まれているbadge.swfはカスタマイズされており、「imageurl」というパラメータでボタンの上に表示する画像を指定できるようになっている。

Adobe Labsで使用されているbadge.swfを用い、画像を追加した「Install Now」ボタン