0

作成してキャンバスに配置した画像を保存しようとしています。次のものがあります。

html:

<canvas id="example" class="test" style="width:600px;" data-id="0"></canvas>
<form name="saveForm" method="post">
    <input id="save" type="submit" value="save">
    <input type="hidden" id="imgData" name="imgData" value="">
</form>

Jクエリ:

$(document).on("click", "#save", function() {
    document.getElementById('imgData').value = canvas.toDataURL('image/png');
    document.forms["saveForm"].submit();
});

PHP:

if($_POST['imgData']){
    // echo "here"; die; // tried this but not firing so no data getting to hidden field
    $upload_dir = '/home/mydir/public_html/pages/test/imgEdit/';
    $img = $_POST['imgData'];
    $img = str_replace('data:image/png;base64,', '', $img);
    $img = str_replace(' ', '+', $img);
    $data = base64_decode($img);
    $file = $upload_dir."image_name.png";
    $success = file_put_contents($file, $data);
}

しかし、それは単に機能していないだけで、何も起こらず、インスペクターにエラーもありません。PHP のエコー テストから明らかなように、画像データは jquery クリック時に非表示フィールドに入力されていません。

私は何が欠けていますか？

4

0 に答える 0