我想要发送用户从他们的机器中选择的图像以及表单数据,所有这些数据都包装在一个JSON对象中并发送到服务器。我使用Node作为服务器。是否可以将图像与其他表单元素一起放在JSON对象中并在Node中读取?
发布于 2014-02-21 06:38:46
我遇到的常见方法是使用JSON字符串方法:将图像编码为Base64字符串,并将其设置为发送到服务器的Base64对象的一部分。
另一种方法似乎是使用JSON中的二进制数据,但我以前从未尝试过,所以我没有太多信息。
在Javascript中进行Base64编码的代码示例。具体来看下面的方法
function getBase64Image(imgElem) {
// imgElem must be on the same server otherwise a cross-origin error will be thrown "SECURITY_ERR: DOM Exception 18"
var canvas = document.createElement("canvas");
canvas.width = imgElem.clientWidth;
canvas.height = imgElem.clientHeight;
var ctx = canvas.getContext("2d");
ctx.drawImage(imgElem, 0, 0);
var dataURL = canvas.toDataURL("image/png");
return dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
}
发布于 2014-02-21 06:38:49
有一种方法可以实现这一点:使用图像数据。
在Javascript中,在客户端,FileReader将允许您读取二进制图像数据,并将其转换为base64编码的字符串。
在客户端:
var file = $('.file-upload > input')[0].files[0];
function upload(file) {
var reader = new FileReader();
// when image data was read
reader.onload = function(event) {
// I usually remove the prefix to only keep data, but it depends on your server
var data = event.target.result.replace("data:"+ file.type +";base64,", '');
// make here your ajax call
$.ajax({
url: 'and_so_on',
json: {
data: data
}
});
// read data from file
reader.readAsDataURL(file);
}
在服务器端,您将收到base64编码的图像,您可以使用Buffer构造函数轻松地将其转换为二进制
var buffer = new Buffer(data, 'base64');
请注意,FileReader是not supported by all browsers
https://stackoverflow.com/questions/21926893
复制相似问题