ppBlog official

　こんばんは。お絵かきツールの話でも。

　小生のweblogのアクセス解析の「検索ワード」を見ると、いつも「お絵かきツール」とか「FLASH　お絵かき」での訪問がトップにきてます。「Flash版お絵かきツール」のページがリンクされているんですが、これ2005年6月のエントリーなので、昔日という印象ですが、このFLASH版お絵かきは、この時点から何も変わってません。当時、画像を保存したりするメソッドが分からなくて頓挫したままになってまして。ppBlogに組み込む予定だなんて言ってましたが。。今は、FLASHで作成した画像データを保存したり、呼び出したりする技は知っているので、この古いスクリプトを対応させても良いのですが、元々が中途半端なプログラムなので、凝り出すと時間がかかりそうです。

　で、Web上には、FLASHではありませんが、Java仕様の大変高機能なお絵かきツールがいくつかあるので、それを利用するのが最善であろうと思います。おそらく一番有名なのは、「しぃペインター^G」でしょう。このソフトの存在は知っていたんですが、実際にダウンロード（DL）して、中身を読んだことはありませんでした。で、おとといDLして読んでみると、色々設置方法などについて詳しく書かれています。サーバーへのデータの受け渡しの記述もあるので、簡単にPHPと連携できそうです。で、やってみたらあっさりと画像データを取得できたので、簡単なプログラムを書いてみました。自由に投稿できて、最新の9個の画像をギャラリー閲覧出来ます。

しぃペインターを組み込んだデモ

Javaのことは全く分かりませんが、しぃペインターのプログラムが、サーバーに画像データを渡してくれるので、それをPHPでキャッチ出来れば良いわけです。しぃペインターの説明が分かりやすく、簡単に実装できました。上のデモのキモの部分を抜き出してみると、

if(!$raw_data = file_get_contents('php://input')){
 $raw_data = $HTTP_RAW_POST_DATA; // 次の手段
}

　基本的には、これがすべてです。php://input は、POSTの生データの読み込みを許可するプロトコルで、これとfile_get_contents関数とを組み合わせるだけですね。まずこのやり方でトライして、で、駄目だったら $HTTP_RAW_POST_DATA を見るという流れです。これで、しぃペインターからのデータを無事にゲット出来たら、後は、ごにょごにょデータを弄るだけですね

しぃペインターのマニュアルによれば、

画像などを投稿した後の返り値にURL:と言う文字が初めにある場合、続く文字列をURLとして読み取ってその指定されたURLへジャンプする機能がつきました。これにより細かい動作をサーバー側が管理する事が容易になります。

とのことなので、データの取得に失敗したら、

if(empty($raw_data)){
 exit('URL:draw.php?mode=error&due=empty'); // 生データの取得に失敗した場合
}

みたいな記述で、自由にページを遷移させることができます。うまく生データを取得できた場合以下の処理が続きます。

$img_name = time(); // タイムスタンプをファイル名に
$img_size = substr($raw_data, 9, 8); // ファイルサイズ情報は必ず８バイト
$img_data = substr($raw_data, 19, $img_size); // 以下、画像データ
$img_ext = strstr(substr($img_data, 0, 4), 'PNG') ? '.png' : '.jpg'; // 最初の4文字で拡張子を識別

if($fp = @fopen(IMG_DIR.$img_name.$img_ext, 'wb')){
 flock($fp, LOCK_EX); // まぁ、とりあえず
 fwrite($fp, $img_data);
 fclose($fp);
 exit('URL:draw.php?mode=done&aim='.$img_name.$img_ext); // 書き込み成功した後のリンク処理
} else exit('URL:draw.php?mode=error&due=fopen'); // 書き込み失敗！

　こんなに簡単なら、もっとはやく向き合っていればよかった。。