我有一个node.js服务器,它使用express-fileupload来接受图像。现在我正在开发上传图像的功能。但我不想使用 < form > 因为出于各种原因我更喜欢 xhtml 请求,但主要是因为我不想在用户上传图像后重定向用户。
我尝试过将图片作为 dataURI 读取,将其发送到服务器,解码并将其写入文件,但没有成功,而且似乎资源密集且费力。
//I used the dataString from the callback method and wrote it to a file using fs.writeFile
function dataURItoimage(dataString, callback){
const atob = require("atob");
dataString.replace("data:image/jpeg;base64,", "");
dataString.replace("data:image/png;base64,", "");
atob(dataString);
callback(null, dataString);
}
//User side code
avatarInput.addEventListener("change", (e) => {
const reader = new FileReader();
reader.readAsDataURL(avatarInput.files[0]);
reader.onload = () => {
avatar = reader.result;
tosend.avatar = reader.result;
}
}, false);
uploadButton.onclick = () => {
var request = new XMLHttpRequest();
request.open("POST", "/avatarUpload");
request.setRequestHeader("Content-Type", "application/json");
var tosend = {avatar: ""};
tosend.avatar = avatar;
request.send(JSON.stringify(tosend));
}
是否有更好的方法将用户可以选择的图像上传到 Node.js 服务器?
最佳答案
你可以试试这个例子。这对我有用。希望对您有帮助。
发送dataURL抛出Ajax请求:
const dataURL = snapshotCanvas.toDataURL('image/png');
$.ajax({
url: 'http://localhost:3000/upload-image',
dataType: 'json',
data: { data: dataURL },
type: 'POST',
success: function(data) {}
});
接收请求:
router.post('/', (req, res) => {
const base64 = req.body.data.replace(/^data:image\/png;base64,/, "");
fs.writeFileSync(`uploads/images/newImage.jpg`, base64, {encoding: 'base64'});
}
关于javascript - 不使用 <form> 将图像上传到 Node.JS 服务器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55786988/