如何将使用sketch.js修改的html canvas保存到MySQL数据库

Question

好的，所以我有一个包含html表单的php页面。在填写此html表单后，我正在使用PHP将数据保存到MySQL数据库（所有页面都在同一页面上）。

在此表单中，我使用 Sketch.js

绘制了 HTML画布

http://intridea.github.io/sketch.js/

<canvas id="tcInjuryImageFront" width="283px" height="629px" style="background-image: url('includes/images/image001.png'); float: left;"></canvas>

我想将此画布保存为图像，并将其余的表单数据放在我的MySQL数据库中（使用PHPMyAdmin）。

我该怎么做呢？我试过这里发布的方法：how can we save html5 canvas image to database in php;但是，我收到以下错误：

XMLHttpRequest无法加载http://test.com/index.php。请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，不允许原点“http://www.test.com”访问。响应的HTTP状态代码为404。

当我使用以下javascript函数时：

function saveCanvas()
{
var frontCanvas = document.getElementById("tcInjuryImageFront");
var dataUrl = frontCanvas.toDataURL();

$.ajax({
    type: "POST",
    url: "http://test.com/index.php",
    data: {image: dataUrl}
})
.done(function(respond){alert("done: "+respond);})
.fail(function(respond){alert("fail");})
.always(function(respond){alert("always");})
} //end saveCanvas

当我运行此操作时，我会收到失败和始终的提醒。这对我没有任何意义，因为这是我目前正在使用的完全相同的URL，因此它绝对属于同一个域。

坦率地说，虽然这种方法对我的目的来说似乎不正确，因为我不是想把这些数据加载到新页面中，我只是想让它在当前页面的PHP中可访问，所以我可以使用其余的表单数据将其保存到MySQL数据库中。

想法？