图片请求时需要携带token的情况
setHeader () {
let img = document.getElementById('imgProcess')
let url = img.getAttribute('authSrc')
let request = new XMLHttpRequest()
request.responseType = 'blob'
request.open('get', url, true)
request.setRequestHeader('Authorization', getToken())
request.onreadystatechange = e => {
if (request.readyState === XMLHttpRequest.DONE && request.status === 200) {
img.src = URL.createObjectURL(request.response)
img.onload = () => {
URL.revokeObjectURL(img.src)
}
}
}
request.send(null)
},
创建一个a标签下载文件、有时候下载文件需要权限,需要添加token
var xhr = new XMLHttpRequest();
xhr.open('get', url, true);
xhr.responseType = "blob"; // 返回类型blob blob 存储着大量的二进制数据
xhr.setRequestHeader('Authorization', getToken()) // 添加toke下载文件
xhr.onload = function () {
console.log(xhr)
if (this.status === 200) {
var blob = this.response;
var fileName = decodeURIComponent(xhr.getResponseHeader("content-disposition").split(";")[1].split("filename=")[1]);
var reader = new FileReader();
reader.readAsDataURL(blob); // 转换为base64,可以直接放入a标签href
reader.onload = function (e) {
var a = document.createElement("a"); // 转换完成,创建一个a标签用于下载
a.download = fileName;
a.href = e.target.result;
document.body.appendChild(a);; // 修复firefox中无法触发click
a.click();
document.body.removeChild(a); //释放之前创建的URL对象
window.URL.revokeObjectURL(url); };
}
}
xhr.send(); // 发送ajax请求
下载兼容IE
var xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
//设置请求头参数的方式,如果没有可忽略此行代码
xhr.setRequestHeader("Authorization",`Bearer ${idToken}`));
//设置响应类型为 blob
xhr.responseType = 'blob';
//关键部分
xhr.onload = function (e) {
//如果请求执行成功
if (this.status == 200) {
var blob = this.response;
var a = document.createElement('a');
// blob.type = "application/octet-stream";
var url = window.URL.createObjectURL(blob);
var fileName = decodeURIComponent(xhr.getResponseHeader("content-disposition").split(";")[1].split("filename=")[1]);
if (window.navigator.msSaveBlob) {
try {
window.navigator.msSaveBlob(blob,fileName)
} catch (e) {
console.log(e);
}
} else {
a.href = url;
a.download = fileName ;
document.body.appendChild(a); // 火狐浏览器 必须把元素插入body中
a.click();
document.body.removeChild(a);
//释放之前创建的URL对象
window.URL.revokeObjectURL(url);
}
}