1.通过Form表单上面的方法是通过表单自身的属性提交的。看似简单，但也有它最大的缺点，就是提交后直接跳转，这对于目前的大部分需求来说是不够的。然后介绍另一种直接使用xaj的post方法和FormData上传文件的方式。2.通过jQuerypost请求上传HTML多文件上传JS(function(){$('#upload').change(function(e){letfiles=e.target.files;letparams=newFormData();for(leti=0;iJS(function(){$('#upload').change(function(e){letfiles=e.target.files;letparams=newFormData();for(leti=0;i{//将数组放入得到的base64本地图片地址previewsArr.push(fileReader.result);}}返回previewsArr；}//图片压缩函数compressImage(base64URL){letimg=newImage();让画布=document.createElement('画布');让context=canvas.getContext('2d');img.src=base64URL;img.onload=()=>{//图片原始大小varoriginWidth=img.width;varoriginHeight=img.height;//最大尺寸限制letmaxWidth=400,maxHeight=400;//目标尺寸lettargetWidth=originWidth,targetHeight=originHeight;//图片尺寸超过400x400的限制if(originWidth>maxWidth||originHeight>maxHeight){if(originWidth/originHeight>maxWidth/maxHeight){//更宽，根据宽度限制尺寸targetWidth=maxWidth;targetHeight=Math.round(maxWidth*(originHeight/originWidth));}别的{目标高度=最大高度；targetWidth=Math.round(maxHeight*(originWidth/originHeight));}}//画布缩放图像canvas.width=targetWidth;canvas.height=targetHeight;//清除画布context.clearRect(0,0,targetWidth,targetHeight);//图片压缩context.drawImage(img,0,0,targetWidth,targetHeight);//canvas直接转换blob二进制文件，但是大部分浏览器不支持//canvas.toBlob(function(blob){//console.log(blob)//resolve(blob)//},'image/png');让base64Data=canvas.toDataURL("image/png",0.92);让blob=dataURItoBlob(base64Data);//上传图片letparams=newFormaData();params.append('visit_file',blob,'cavas.png');上传图片（参数）；}}/***base64转二进制文件*@param{*}base64Data*/functiondataURItoBlob(base64Data){varbytes=window.atob(base64Data.split(',')[1]);//去掉url的header，转成byte//处理异常，ascii码小于0大于0转换varab=newArrayBuffer(bytes.length);varia=newUint8Array(ab);for(vari=0;ires).catch((error)=>{console.log(error);})}最近在做项目的时候也遇到了一个需求。当时用的是vue+axois。怎么提交报错，最后发现文件不见了以前只要配置三个必备参数就可以上传成功。如果希望用户有更好的体验，可以在本地对图片进行压缩预览。你可以做得更好，有什么问题可以留言告诉我！也可以在我的基础上进行更多的扩展。感谢大家阅读我的文章！
