将HTML5画布数据保存到服务器

我知道有很多关于此问题的问题，但目前我正试图将用户创建的HTML5画布数据保存到我的Web服务器上的特定文件夹。将HTML5画布数据保存到服务器

我已经能够使用以下，将图像保存到服务器：

function sendData(postData){ 
var ajax = new XMLHttpRequest(); 
ajax.open("POST",'saveFrame.php',true); 
ajax.setRequestHeader('Content-Type', 'canvas/upload'); 

var comicID = document.getElementById('comicID').value; 

ajax.onreadystatechange=function() 
{ 
    if (ajax.readyState == 4) 
    { 
     alert("Frame saved"); 
    } 
} 
ajax.send(postData); 
}

saveFrame.PHP文件

<?php 

if (isset($GLOBALS["HTTP_RAW_POST_DATA"])) 
{ 
    // Get the data like you would with traditional post 
    $rawImage=$GLOBALS['HTTP_RAW_POST_DATA']; 

    // Remove the headers 
    $removeHeaders=substr($rawImage, strpos($rawImage, ",")+1); 

    // decode it from base 64 and into image data only 
    $decode=base64_decode($removeHeaders); 

    // save to your server 
    $saveName = "test.jpeg"; 
    $fopen = fopen($saveName, 'wb'); 
    fwrite($fopen, $decode); 
    fclose($fopen); 
} 
?>

我希望能够做的就是一起传递一些变量什么这样我就可以在saveFrame.php文件中使用PHP动态查找我的数据库，以确定它应该保存为什么文件名。我不确定如何做到这一点，因为我不习惯使用AJAX。

任何建议表示赞赏，

亚历

来源

2012-01-23 Alex Macdonald

您是否可以保存画布并将其成功渲染回来？ – Mutant

可以使用HTML5 canvaspixelarray属性来获取画布的数据。

来源

2012-02-02 08:10:02

将HTML5画布数据保存到服务器

回答

相关问题