如何保存画布图像上传到服务器之前？

所以基本上我通过摄像头捕捉图像与一些HTML5 vidoe,canvas和button标签，但在我上传此图像到服务器之前，我需要将图像保存到Internet临时目录，然后访问图像并上传图像到服务器，到目前为止，我可以做的是捕捉到画布上的图像，但不知道如何将它保存在本地PC互联网temp目录，我发现了一个已经问的问题，其答案是如何保存画布图像上传到服务器之前？

var image = canvas.toDataURL("image/png").replace("image/png", "image/octet-stream"); window.location.href=image;

的上面代码的问题是，它弹出下载框到客户端并请求客户端保存它，但我需要保存图像，而不会提示任何东西o用户并将其保存到Internet临时目录中。

这里是我把画布图像

document.getElementById("snapButton").addEventListener("click", function() { 
context.drawImage(video, 0, 0, 640, 480); 
var myImg = document.getElementById("myImg"); 
myImg.src = canvas.toDataURL(); 
});

所以，如果有人告诉我，我怎么添加什么代码上面eventListener保存图像我会很感激的代码。

来源

2016-09-18 darees

_“上面代码的问题是，它弹出下载框到客户端，并要求客户端保存它，但我需要保存图像，而不会提示任何用户到Internet临时窗口”_只有用户可以设置应该将哪个文件夹下载文件保存到浏览器首选项。为什么你不想让用户选择文件将被保存在用户文件系统的目录？ – guest271314

没有你有问题的问题我不想下载图像我直接想将它保存到临时文件夹， – darees

_“不，你有问题的问题我不想下载图像我直接想把它保存到temp文件夹“_”下载“和”保存“有什么区别？将图像“保存”到“临时文件夹”的目的是什么？你的意思是用户文件系统中的“临时文件夹”？ – guest271314

如果您只需要一个临时地点来存放一小段数据（< 5mb），则可以使用localStorage。将localStorage视为您应用程序数据的本地临时存储区域。 LocalStorage不需要用户的权限。

但出于明显的安全原因，将任何内容存储到用户的磁盘将需要他们的许可，所以你不能避免弹出给用户。

来源

2016-09-18 18:11:24 markE

当'canvas.toDataURL（）'可以作为变量存储时，为什么要保存到'localStorage'？ – guest271314

@ guest271314问题询问关于保存到用户设备。是的，你可以直接将AJAX的dataURL到服务器（我可能会这样做）。你将不得不问问为什么他们有这个要求。 – markE

是的，在评论中提出了这个问题给OP。不完全清楚实际是什么要求。 OP使用术语“保存”和“下载”，就好像它们是两个独立的进程一样_“不，你有问题，我不想下载图像，我直接想将它保存到临时文件夹中，”_。您的提议会将文件保存到用户的文件系统，尽管您可以通过存储图像的“Blob URL”而不是“image URI”来减少'localStorage'处引用文件的总体大小。 – guest271314

如何保存画布图像上传到服务器之前？

回答

相关问题