1 前端用formdata()的方式提交
//创建一个新的canvas
var canvas = document.createElement("canvas");
var content = document.getElementById('Home-Container');
var aLink =document.createElement('a');
// aLink.setAttribute('download', uuid);
var w = content.offsetWidth ;
var h = content.offsetHeight;
//可以按照自己的需求,对context的参数修改,translate指的是偏移量
// var context = canvas.getContext("2d");
// context.translate(0,0);
var context = canvas.getContext("2d");
context.scale(2, 2);
html2canvas(content, {
width:w,
height:h,
windowWidth: document.body.scrollWidth,
windowHeight: canvas.scrollHeight
}).then(function(canvas) {
//document.body.appendChild(canvas);
//canvas转换成url,然后利用a标签的download属性,直接下载,绕过上传服务器再下载
//aLink.setAttribute('href', canvas.toDataURL());
let src = canvas.toDataURL("image/png")//这里转成的是base64的地址,直接用到img标签的src是可以显示图片的
var fd = new FormData();
function dataURItoBlob(dataURI) {//图片转成Buffer
var byteString = atob(dataURI.split(',')[1]);
var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0];
var ab = new ArrayBuffer(byteString.length);
var ia = new Uint8Array(ab);
for (var i = 0; i < byteString.length; i++) {
ia[i] = byteString.charCodeAt(i);
}
return new Blob([ab], {type: mimeString});
}
var blob = dataURItoBlob(src);
fd.append('source_from','webpage_upload')//在formdata加入需要的参数
fd.append('file',blob)
let config = {
//添加请求头
headers: { 'Content-Type':'multipart/form-data'}
};
// 获取form所有数据
const instance=axios.create({
responseType: 'blob'
})
instance.post(url.System.createReport+"?TIME="+window.TIME0+
"&RYZ="+window.RYZ0+"&ZD="+window.ZD0+"&AD="+window.AD0+"&PH="+window.PH0+"&SW="+window.SW0+"&NODENAME="+window.nodeName+"&YLS="+
window.YLS0+"&DL="+window.DL0+"&DY="+window.DY0+"&DEPTH="+window.DEPTH0+"&LAT="+window.LAT0+"&LON="+window.LON0+"&YHHYDW="+window.YHHYDW0
,fd,config).then(res => {
const content = res.data
const blob = new Blob([content])
const fileName = '下载的文件.docx'
if ('download' in document.createElement('a')) {//非ie下载
const elink = document.createElement('a')
elink.download = fileName
elink.style.display = 'none'
elink.href = URL.createObjectURL(blob)
document.body.appendChild(elink)
elink.click()
URL.revokeObjectURL(elink.href)
document.body.removeChild(elink)
} else {//ie10+下载
navigator.msSaveBlob(blob, fileName)}
})
aLink.click();
});
2 后台获取文件
MultipartHttpServletRequest multipartRequest=(MultipartHttpServletRequest) request;
InputStream file1 =multipartRequest.getFile("file").getInputStream();