Flashのムービ−クリッピインスタンスをビットマップ画像としてサーバーに送信

Flashで動作するお絵描きツール的なものをよく見かけますが、描いたものをビットマップデータとしてサーバーに送信するにはどうすればいいか。
今日ちょっと調べたらわかりましたので、メモメモ。

※AS3のみです。


処理の概要は、

  1. Flash側で、ムービークリップインスタンスをビットマップ化したのち、Base64形式にエンコードしてサーバーに送信
  2. エンコードされたテキストを受け取ったPHPが、それをデコードし、PNGとして表示


というものです。

Flash

1.使用する2つのライブラリをダウンロードします。

as3corelib:
http://code.google.com/p/as3corelib/

as3crypto:
http://code.google.com/p/as3crypto/

2.作成するswfファイルと同じディレクトリに"com"というディレクトリを作成し、その下にそれぞれ以下のフォルダをコピーします。

as3corelib:
corelib/src/com/adobe

as3crypto:
Crypto/com/hurlant

3.ビットマップ化したいムービークリップインスタンスを作成します。(インスタンス名は、ここでは"canvas"とします)
4.送信アクション用のボタンを設置します。(インスタンス名は、ここでは"myButton"とします)
5.フレームアクションとして、以下のアクションを入力します。

import com.adobe.images.*;
import com.hurlant.util.*;


//ビットマップ化
var bmp:BitmapData = new BitmapData(300,300);
bmp.draw(canvas);


//ビットマップオブジェクトをテキスト化
var str:String = Base64.encodeByteArray(PNGEncoder.encode(bmp));


//テキスト化した文字列をURLエンコード
var escstr:String = escapeMultiByte(str);


//送信ボタンのイベントリスナーとアクションを設定
var myButtonListener:Object = new Object();


myButton.addEventListener(MouseEvent.CLICK,onClick);
function onClick(event:MouseEvent):void{
var request:URLRequest = new URLRequest('http://***/test.php?img='+escstr);
navigateToURL(request);
}


※"http:/***/test.php"の部分は、実際にリクエストするPHPファイルのURLに適宜変更してください。

サーバーサイドスクリプトPHP)側

以下の内容のPHPファイルを作成します。


以上で、Flashムービークリップインスンタンスをビットマップ画像としてサーバーに渡すことができます。

このサンプルでは、サーバー側の処理は単に受け取った画像データを表示しているだけですが、受け取っているのは単なるテキストデータなので、あとはデータベースに保存するなりなんなり、随意に作り込んでいけばいいと思います。