根据example,我用文件输入设置了SweetAlert2弹出窗口(仅允许图像):
const {value: file} = await swal({
title: "Image upload",
text: "Upload your profile image",
input: 'file',
inputAttributes: {
'accept': 'image/*',
'aria-label': "Upload here your image"
}
});
然后我通过XMLHTTPRequest将ajax请求发送到一个PHP文件:
if (file) {
if (!file) throw null;
swal.showLoading();
if (window.XMLHttpRequest) {
// code for modern browsers
var xmlhttp = new XMLHttpRequest();
} else {
// code for old IE browsers
var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function () {
// success message
};
xmlhttp.open("GET", "includes/uploadimage.php?image=" + file, true);
xmlhttp.send();
}
PHP文件会将SweetAlert2输入生成的文件对象(然后通过XMLHttpRequest传递)保存在服务器上的文件中,但是我不知道该怎么做。
答案 0 :(得分:0)
我通过使用JS阅读器解决了这一问题,该阅读器从其中读取数据URI,然后使用POST XMLHttpRequest通过FormData将其发送。
if (file) {
if (!file) throw null;
swal.showLoading();
const reader = new FileReader;
reader.onload = (e) => {
const fd = new FormData;
fd.append('image', e.target.result);
if (window.XMLHttpRequest) {
// code for modern browsers
var xmlhttp = new XMLHttpRequest();
} else {
// code for old IE browsers
var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function () {
// ... do something ...
};
xmlhttp.open("POST", "includes/uploadimage.php", true);
xmlhttp.send(fd);
};
reader.readAsDataURL(file)
}