|
|
|
コネクト株式会社 技術情報コンテンツ |
|
Top ＞ [[Web技術]] Flash + PHP(この項目は2006年以前の作成です。2011年1月時点では情報が古くなっている可能性があります) Flashとは Flash(Macromedia Flash)とは、グラフィックス、オーディオ、テキスト、ビデオと言った各種多様なデジタルメディアを組み合わせる事によって、コンテンツを作成、再生するテクノロジーです。元はアニメーション用のソフトウェアとして開発されたFlashですが、バージョンアップを重ね、現在ではその表現力の高さとインタラクティブ性の高さから、商品のWebプロモーションから携帯電話のインターフェイスまで幅広い分野で採用されています。 また、Flashの動作環境であるFlashPlayerの普及率も9割を超えており、事実上の標準規格となりつつあります。 このように、インターネットの発展と共に、幅広い層の人がインターネットを利用するようになった現在、サービスやそれを使う人に合わせたデザイン／インターフェースの多様化が求められており、HTMLの表現能力では限界があると言われています。そこで最も注目されているのがFlashなのです。Flashは、優れたデザインとインターフェイスを兼ね備えたリッチクライアントを手軽に作成する事が出来ます。 例えば、最近良く目にするようになったPIP(Person in Presentation)等が良い例です。ビデオや音声を駆使したPIPはFlashの得意分野であり、その訴求力はテキストベースのそれとは比較になりません。リッチコンテンツの『リッチ』とは、ただ単に派手だったり情報量が多いと言う意味ではありません。ユーザーがコンテンツを通して豊かな体験を出来ると言う意味での『リッチ』でもあるのです。 Flashの特徴 Flashの使用するのであれば、その特徴は十分に知っておかなければ行けません。特徴を長所と短所の点から見て行きましょう。 ○表現力が高い 上でも触れましたが、Flashはグラフィックス、オーディオ、テキスト、ビデオと言った様々なメディアファイルを扱う事が出来ます。 元々アニメーション用途だった事を考えれば、この『表現力が高い』と言うのはあたり前の事です。 ○クロスプラットフォーム Flashは、その再生環境であるFlashプレイヤーが導入されていれば、どのような環境でも再生する事が出来ます。 現在ではWindowやMacはもちろん、Linux、更には携帯電話をはじめとする組み込み機器にもFlashプレイヤーは導入されています。 ○企業によるサポート FlashはMacromedia社によって開発、販売されてるソフトウェアです。つまり、Macromediaに社によるサポートを受ける事ができます。 次に短所です。 ×HTMLとの相性の悪さ Flashは<Object>タグによりHTMLの中に埋め込まれますが、その制御はFlashプレイヤーに依存しており ブラウザから制御する事はほとんど出来ません。例えば、戻るボタン等が良い例です。 ×プラグインへの依存 長所では、プラグインがクロスプラットフォーム性を作り出していると言いましたが、プラグインに依存してしまうのはマイナスでもあります。 ×企業へ依存 これも長所の逆の話で、開発、販売をMacromedia社が行っていると言う事は、Macromedia社主導で全てが進んでしまうと言う事です。 仕組み Flashがサーバと通信する場合、FlashプレイヤーはFlashを再生しているブラウザを通してサーバにアクセスします。サーバからレスポンスを受信すると、ブラウザからFlashプレイヤーにデータが渡され、渡されたデータを使ってFlash内部で遷移します。この際、表示されているページ自体の書き換えは行われません。 Flashがサーバと通信する場合は、非同期通信が基本になります。つまり、通信中も他の処理は動き続けるという事です。もし、同期的に扱う必要がある場合は全ての処理を中断し、通信の終了を待つような仕組みを作らなければなりません。 Flashが通信を行うサーバ側に目を向けてみましょう。実は、サーバ側では特別な事は殆どありません。気をつけるべき事は次の２つのみです。 ・Flashが理解できる形式で出力する 当たり前の話ですが、通常のようにHTMLを出力しても無意味です。Flashでは通信上で使用できる形式がいくつか決まっています。 ・日本語等マルチバイト文字はUTF-8で出力する Flashではマルチバイト文字をUTF-8で扱います。例外的にShift-JISも扱う事が出来ますがこれは推奨されていません。 これはいずれも出力（レスポンス）に関する事で、入力（リクエスト）に関しては、Flashからの通信である事は基本的に意識する必要はありません。 LoadVarsを使った通信 Flashにはサーバと通信を行う方法がいくつか用意されていますが、その中でも基本であり、また通常よく使われているのがLoadVarsクラスです。LoadVarsクラスは、受信完了を通知するコールバック関数を備える等Flashがサーバと通信を行うための様々な機能を提供します。この制御を行うためには、もちろんAcionScriptを記述します。 param1=value1¶m2=value2&........ この形式はCGIでは一般的なもので、通常HTMLのフォームからサブミットされた場合に送信される形式です。LoadVarsクラスでは、送信だけでなく受信時もこの形式である必要があります。これが上で述べた『Flashが理解できる形式で出力する』と言う事なのです。 では、簡単な例を用いて説明します。ここでは、リクエストを次のようにします。 req_year=2005&req_month=9&req_day=26 これをサーバ側PHPに送信し、レスポンスを得ます。レスポンスは次にようにします。 res_status=1&res_hour=12&res_min=15&res_sec=30 次にActionScriptのソースを示します。 1 : // 送信用LoadVarsインスタンス
2 : var send_lv:LoadVars = new LoadVars();
3 : // 受信用LoadVarsインスタンス
4 : var recv_lv:LoadVars = new LoadVars();
5 : // 受信が完了した際に呼び出されるイベントハンドラメソッド
6 : recv_lv.onLoad = function(success){
7 : //ロードした後の処理
8 : if (success && this.res_status == 1) {
9 : trace(this.res_hour);
10: trace(this.res_min);
11: trace(this.res_sec);
12: } else {
13: trace("error");
14: }
15: };
16: // 送信パラメータを送信用LoadVarsインスタンスのプロパティの設定
17: send_lv.req_year=2005;
18: send_lv.req_month = 9;
19: send_lv.req_day=26;
20: // 送信実行
21: send_lv.sendAndLoad("http://www.(弊社ドメイン)/tech/flash/sample.php", recv_lv, "POST");
・1〜4行目 ・5〜15行目 ・16〜19行目 送信パラメータを送信用LoadVarsインスタンスのプロパティとして設定します。こうする事によって送信時に自動的にリクエストパラメータが形成されます。日本語等の特殊な文字も自動的にURLEncodeがなされます。 ・21行目 LoadVars.sendAndLoadはリクエストパラメータを送信し、サーバレスポンスを取得する際に使用します。引数としてリクエスト先URL、受信用オブジェクト、リクエストメソッドを指定します。送信するリクエストパラメータは上で設定した物より自動的に生成されます。 サンプル今回はサンプルとしてFlashホワイトボードを用意してみました。( http://www.(弊社ドメイン)/tech/samples/php_flash/fbbs.html ) chk=1127719392502&cl=1&sz=1&y=575&x=145&msg=test&evt=wr ※ chk : キャッシュ対策のタイムスタンプ cl : 文字色 sz : 文字サイズ x : x座標 y : y座標 msg : メッセージ内容 evt : 書き込みイベント名 evt=wrが指定されていた場合にPHPはこのリクエストを書き込みと見なし、入力内容の検査を行った上で、書き込み内容をファイルに保存します。 レスポンスは次のような形になります。 log1=53,63,1,1,test&log2=213,192,3,2,%E3%81%A6%E3%81%99%E3%81%A8&result=1
※
log${n} : x軸,y軸,文字サイズ,文字色,メッセージ内容(nが大きいほど新しい書き込み)
result : 実行結果。正常時に1、異常時に0
これをFlash側で解析し、表示させます。 ところで、先にも触れましたがFlashではマルチバイト文字をUTF-8で表します。そのためPHP側でもUTF-8で扱うようにしなければ文字化けを起こしてしまいます。 // 入力文字コードをUTF-8に
mb_internal_encoding("UTF-8");
// 出力文字コードをUTF-8に
mb_http_output('UTF-8');
 |
fbbs.tar.gz
fbbs_ss.png