
お勉強です。
FLASHを使用した、画像のインポート( アップロード)から描画、ダウンロードまでの、
一連の流れのFLASHを作ったので、公開します。
ローカルディスクの画像をロードし、FLASHで独自に描画処理を組み込み、
画像ファイルとしてローカルにディスクにダウンロードすることが可能です。
これで、ユーザーが任意の画像をアップして、お絵かきし、
書き出して保存(もしくはサイトに公開)するようなFLASHが作れます。
DRAWシリーズにも、実装していく予定です。
サンプルFLASH
操作方法
特徴
インポート、ダウンロードともに、いったんサーバーにアップロードしてますが、
一時的にアップロードしてるだけで、
すぐに削除されます。
(サーバーにファイルがたまらないし、第三者に見られることもありません)
仕組み
FLASH単独でできればいいのですが、セキュリティの関係で、ファイル入出力の機能は制限されています。
なので、ファイル入出力の部分は、サーバー上にアップされたPHPプログラムをかまして実現してます。
画像インポート
- 画像(png,jpg)をサーバーにアップ
- ローカルの画像データをFileReferenceを使って、POSTデータでサーバー上のPHPに送信
- PHPで画像データをサーバーに保存
- 保存した画像URLをFLASHにコールバック
- アップした画像をFLASHにロード
- ロードし終わったらサーバーの画像削除
画像ダウンロード
- 画像(png,jpg)をサーバーにアップ
- ダウンロードしたいBitmapData画像を外部ライブラリを使用し、PNGまたはJPGにエンコード
- エンコードされた画像データをPHPに送信し、サーバーにアップロード
- アップロードした画像URLをFLASHにコールバック
- アップした画像をダウンロード
- ロードし終わったらサーバーの画像削除
参考情報
BitmapData画像を、PNG、JPGへエンコードしてくれるAS3ライブラリ
以下のライブラリは、ActionScript 3用のユーティリティライブラリで、
その中のJPEG、PNGエンコード使用すれば、FlashのBitmapDataを、
PNG、JPGへエンコードしてくれます。
as3corelib
以下は、参考にさせてもらったサイトです。
Flashから画像ファイルを保存する - FICC LABS
PNGエンコーダ - Flash OOP Japan
Flash中のBitmapをJPG/PNGで保存するには - TECH Matari
PNG、JPGへエンコード自体は、ものすごく簡単ですが、その後のPHPの処理のほうが面倒ですね。
そのほか
ソースFLASHファイル
ソースのFLASHとPHPファイルをアップします。自己責任で改変OKです。
素敵な機能を追加したら教えてください。
[
ソースのFLAファイル ]
なお、as3corelibのクラスファイルは含めてありませんので、ご注意を。
あと、PHPの動くサーバーにアップする必要があります。
PHPファイルと、temporaryディレクトリは、SWFとは別のサーバーでも問題ありません。
(PHPへのパスをあわせる必要はあります)
クレジット
設計・実装 : PIXEL IMAGE 田中
以上です。
使用は、ご自由に。
■追記 2008/06/26 その2
ファイルの削除に関して、すこし機能不足があったので、追加しました。
ロードし終わったら、ファイルを削除するようになっているのですが、
ロード途中でやめてしまった場合に、FLASH側でロードまれに命令がいかず削除されずに残ってしまうことがありました。
そこで、削除モレのファイルは、以下のように対応するようにしました。
- アクセスすると同階層にあるファイルをすべて削除するPHPプログラムを作成
- CRONという一定時間ごとに、指定したプログラムを実行してくれるサーバー機能を利用し、一定時間ごとにPHPをコール
- PHPが実行され、削除もれのファイルを、完全に削除(今回のものの場合は、1時間ごとに削除)
ソースファイルも更新してありますので。
CRONの設定方法
CRONの設定方法は、レンタルサーバーであれば、サーバーの管理サイトにて、設定できる機能があると思います。
プログラムパスと、実行時間間隔を指定すればOKです。
(CPIの場合はそうでしたが、そのほかのサーバー会社さんの場合は、不明です)
■追記 2008/06/26 その1
エクスポートもインポートも、いったんサーバーに画像データをPOSTしてるのですが、
回線がADSLの場合は、上り(UP)の速度は、下り(DONW)と比べるとかなり遅いので、ちょっと時間がかかります。
なので、ファイル形式は
JPGのほうが軽いので、処理が早いです。
回線が光の場合は、上り(UP)も下り(DONW)も早いので、快適です。