HTML5 Canvasをサーバー上の画像として保存する方法は?
ユーザーがアルゴリズムから生成された画像を保存できるようにするジェネレーティブアートプロジェクトに取り組んでいます。一般的な考え方は次のとおりです。 生成アルゴリズムを使用してHTML5キャンバス上に画像を作成する 画像が完成したら、ユーザーがキャンバスを画像ファイルとしてサーバーに保存できるようにします ユーザーが画像をダウンロードするか、アルゴリズムを使用して作成された作品のギャラリーに追加できるようにします。 しかし、私は2番目のステップで立ち往生しています。Googleの助けを借りて、私はこのブログ投稿を見つけました。 これがJavaScriptコードにつながりました: function saveImage() { var canvasData = canvas.toDataURL("image/png"); var ajax = new XMLHttpRequest(); ajax.open("POST", "testSave.php", false); ajax.onreadystatechange = function() { console.log(ajax.responseText); } ajax.setRequestHeader("Content-Type", "application/upload"); ajax.send("imgData=" + canvasData); } および対応するPHP(testSave.php): <?php if (isset($GLOBALS["HTTP_RAW_POST_DATA"])) { $imageData = $GLOBALS['HTTP_RAW_POST_DATA']; $filteredData = substr($imageData, strpos($imageData, ",") + 1); $unencodedData = …