html5 canvas在线生成图片后怎么样保存到数据库(服务器端)而不是本地？

canvas画布保存为图片：

function convertCanvasToImage(canvas) {

  var image = new Image()

  image.src = canvas.toDataURL("image/png")

  return image

canvas参数为你的canvas对象，返回一个图片对象，你可以将这个image放到网页结构中，如果要保存图像，可以将canvas.toDataURL("image/png")返回的base64格式的图片数据放到input（type=hidden）中，用户点击上传按钮（或设置表单自动提交），将base64格式的数据上传

形如：

data:image/pngbase64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAABbSURBVDhPY8AFMvJL/oMwlEs8yMgvJVcjyMbSYaERogCC0/OAGIkPwaVQMUhgQWiggWANIAzUhKoBpgjdMIhBUHsxAdxkUgHMBiiXeDAQNkICAsolHuC3kYEBAG/wdxC2W2tUAAAAAElFTkSuQmCC

服务器端接收到字符串（以上字符串可以直接在浏览器中打开，IE低版本就算了，能用canvas的浏览器都可以）后根据data:image/png得知应该保存的文件类型扩展名（png），然后将base64,后面的base64编码字符串解码(后端语言实现，如PHP用base64_decode()函数)，将解码后的二进制数据以二进制的形式保存到服务器上（图片形式）

如果存数据库，可以直接存base64编码，读取时候解码也行，图片建议以文件形式存储，数据库不适合存大文件

canvas开发游戏存储用户数据方法:

1.首先用 SharedPreference 方法适用于简单数据的保持,文如其名,属于配置性质的保存,不适合比较大的情况,默认存放在手机内存里

2. FileInputStream/FileOutputStream 此方式比较适合游戏的保存和使用,流文件数据存储可以保持较大的数据,而且通过此方式不仅能把数据存储在手机内存中,也能将数据

3. SQLite 此方式也适合游戏的保存和使用,

可以用Bitmap.compress函数来把Bitmap对象保存成PNG或JPG文件，然后可以用BitmapFactory把文件中的数据读进来再生成Bitmap对象。

保存的代码大概类似于这样：

try {

FileOutputStream out = new FileOutputStream(filename)

bmp.compress(Bitmap.CompressFormat.PNG, 90, out)

} catch (Exception e) {

e.printStackTrace()

}

具体的可以去查Bitmap和BitmapFactory的帮助文档。

---