使用画布在数据库中存储和显示图像

Question

我尝试将画布的图像保存到我的数据库中。 二进制代码在那里，但问题是显示。

所以基本上我有一个自定义页面，你可以设计一个蛋糕。 它还不在画布中，只使用了CSS。 这是自定义发生的代码（显示）：

<div class="ui-widget-header ui-corner-top">Display Cake</div>
<div class="ui-widget-content ui-corner-bottom">                            
<div id="disp_card" class="disp_temp" style="width: 100%;border: none; z-index: 1;"></div></div>

所以在它之后，我有一个预览按钮，我使用画布将disp_card转换为Image。

这是我的代码：

<script type="text/javascript"> // gets the binary code of the canvas to save in the database

var canvas1 = document.getElementById('preview_image');
var contextSource = canvas1.getContext('2d');
var canvasall = document.getElementById('preview_image');
var context = canvasall.getContext('2d');
context.drawImage(canvas1, 0, 0);
var base64="";
$(function () { 
$("#submitBtn").bind("click", function() {
base64 = $('#preview_image')[0].toDataURL();
$("#show_canvas").attr("src", base64);
$("#show_canvas").show();
});
});
</script>

这是html：

<div id="savecanvas"> 
<canvas id="preview_image" width="600" height="400" style="margin: 0 auto;"></canvas></div>

设计完成后，新生成的蛋糕图像将存储在我的数据库中。

这是php  $ savecanvas = str_replace（＆＃39;＆＃39;，＆＃39; +＆＃39;，$ _POST [＆＃39; canvas＆＃39;]）; 它运作正常。

希望有人可以帮助我。 谢谢你