Javascript 将HTML5画布详细信息保存到MySql

我是HTML5新手，我只想知道如何保存画布数据（我在画布上画了一个正方形）。我想在数据库中保存x、y、h、w或比例，并使用这些数据重新创建图形。我该怎么做

---

多谢各位

为了访问服务器上的数据库，您需要一个服务器端应用程序，它从用户web浏览器接收数据，然后将数据发送到数据库

客户端和服务器之间的通信可以通过或实现

在服务器上运行的web应用程序可以用NodeJS、PHP、ASP.NET、JSP、Django、RubyonRails或任何其他服务器端web开发技术实现

---

或者，如果您不想进行服务器端编程，也可以将数据本地存储在用户中。

您可以将数据存储到mysql数据库或服务器文件中

对于mysql，创建一个名为entities的表，其中包含您想要的列，甚至是一列，并序列化您想要存储的数据

比如说

id | x | y | h | w | scale
1    4   4   4   4    0.5

或

然后序列化并创建PDO查询

$host =     "localhost";
$user =     "someuser";
$pass =     "somepass";
$database = "db_name";

$db = new PDO("mysql:host=$host;dbname=$database", $user, $pass,array(PDO::MYSQL_ATTR_INIT_COMMAND => "SET NAMES utf8")) or die("Connection error!");
$ser_obj = serialize($object_cube);
$query = "INSERT INTO entities ('cube') VALUES (:object)";
$params = array(':object' => $ser_obj );
db_query($query, $params);

function db_query($q,$p = array())
{
    global $db;

    if($stmt = $db->prepare($query))
    {

        if(count($p) > 0)
        {
            foreach ($p as $key => $value) {
                $stmt->bindParam($key,$value);
            }
        }

        $stmt->execute();

    }

}

这应该负责保存，然后由您通过挖掘数据库随时加载所需内容：）

您必须熟悉AJAX->

---

还有一些服务器端语言，如php或asp。否则，您可以将其存储在本地。

一种可能的解决方案是将所有对象数据存储在一个数组中，并在将其发送到服务器之前对其进行序列化：

GraphicObjects = new Array();
GraphicObjects.push({
    x: 10,
    y: 10,
    w: 100,
    h: 200,
    scale: 0.5
}); // Write a function for adding new objects, that's just an example
$.post('urlToPostTo', data: GraphicObjects.stringify());

---

稍后检索JSON数据以重新绘制图像。

如果只将图像存储在数据库中，您需要所有数据吗？还是足够了？而不是作为图像。要在从数据库重新加载后更改方形细节，这意味着您必须将数据存储在某种JS数据结构中，并将其推送到服务器。无法从已绘制的对象中检索数据。

GraphicObjects = new Array();
GraphicObjects.push({
    x: 10,
    y: 10,
    w: 100,
    h: 200,
    scale: 0.5
}); // Write a function for adding new objects, that's just an example
$.post('urlToPostTo', data: GraphicObjects.stringify());