/*需要将dataURL转成Blob对象. 这儿在全局写个方法*/
function dataURLtoBlob(dataURI) {
var arr = dataURI.split(','),
mime = arr[0].match(/:(.*?);/)[1],
bstr = (arr[1]),
n = bstr.length,
u8arr = new Uint8Array(n);
while (n--) {
u8arr[n] = bstr.charCodeAt(n);
}
return new Blob([u8arr], {
type: mime
});
}
/*在全局new 一个 FormData()的对象*/
var fd = new FormData();
/*裁剪后处理里面*/
var blob = dataURLtoBlob(base64url);
fd.append('file', blob)
/*最后 将fd 提交post 给后台 */
function submitImg() {
$.ajax({
type: "post",
url: url,
data: fd,
processData: false, // 不会将 data 参数序列化字符串
contentType: false, // 根据表单 input 提交的数据使用其默认的 contentType
xhrFields: {
withCredentials: true
},
success: function(data) {
//console.log(data)
},
error: function(err) {
console.log("上传失败");
console.log(fd);
}
});
}
后台会给接口给你 url:"上传接口的地址"。
全局变量名在当前这个里面的不要重名就行。
你可以做个小测试:
<script>
var variable = "这里面是没有ajax";
console.log(variable);
</script>
<script>
var variable = "这里面是有ajax的";
$("html").click(function () {
$.ajax({
type: "post",
url: "http://www.baidu.com", //随便给个地址
data: variable,
processData: false,
contentType: false,
xhrFields: {
withCredentials: true
},
success: function(data) {
//console.log(data)
},
error: function(err) {
console.log(variable); //输出: 这里面是有ajax的
}
});
});
</script>