在utiles/index封装方法
import axios from "axios";
import { getToken } from "@/utils/auth"; //自己定义获取token的方法
// 根据文件名后缀区分 文件类型
export function getType(fileName) {
// 后缀获取
var suffix = '';
// 获取类型结果
var result = '';
try {
var flieArr = fileName.split('.');
suffix = flieArr[flieArr.length - 1];
} catch (err) {
suffix = '';
}
// fileName无后缀返回 false
if (!suffix) {
result = false;
return result;
}
// 图片格式
var imglist = ['png', 'jpg', 'jpeg', 'bmp', 'gif'];
// 进行图片匹配
result = imglist.some(function (item) {
return item == suffix;
});
if (result) {
result = 'image';
return result;
};
// 匹配txt
var txtlist = ['txt'];
result = txtlist.some(function (item) {
return item == suffix;
});
if (result) {
result = 'txt';
return result;
};
// 匹配 excel
var excelist = ['xls', 'xlsx'];
result = excelist.some(function (item) {
return item == suffix;
});
if (result) {
result = 'excel';
return result;
};
// 匹配 word
var wordlist = ['doc', 'docx'];
result = wordlist.some(function (item) {
return item == suffix;
});
if (result) {
result = 'word';
return result;
};
// 匹配 pdf
var pdflist = ['pdf'];
result = pdflist.some(function (item) {
return item == suffix;
});
if (result) {
result = 'pdf';
return result;
};
// 匹配 ppt
var pptlist = ['ppt'];
result = pptlist.some(function (item) {
return item == suffix;
});
if (result) {
result = 'ppt';
return result;
};
// 匹配 视频
var videolist = ['mp4', 'm2v', 'mkv'];
result = videolist.some(function (item) {
return item == suffix;
});
if (result) {
result = 'video';
return result;
};
// 匹配 音频
var radiolist = ['mp3', 'wav', 'wmv'];
result = radiolist.some(function (item) {
return item == suffix;
});
if (result) {
result = 'radio';
return result;
}
// 其他 文件类型
result = 'other';
return result;
}
//跨域查看或下载文件,type有值并且只有文件类型是pdf的时候能在浏览器预览
export function down_loadfile(link, name, type) {
let url = link;
let fileType = ''
if (getType(url) == "pdf") {
fileType = "application/pdf";
}
axios
.get(url, {
responseType: "blob",
headers: { Authorization: "Bearer " + getToken() },
})
.then((res) => {
const blob = new Blob([res.data], { type: fileType })
// 注: mime类型必须整正确, 否则下载的文件会损坏
if (window.navigator && window.navigator.msSaveOrOpenBlob) {
// 兼容IE
window.navigator.msSaveOrOpenBlob(blob, element.original_name);
} else {
if (fileType && type) {
let showFile = window.URL.createObjectURL(blob);
window.open(showFile); //查看功能需要浏览器打开
} else {
let downloadElement = document.createElement("a");
downloadElement.href = window.URL.createObjectURL(blob); // 创建一个DOMString
downloadElement.download = name;
downloadElement.click();
window.URL.revokeObjectURL(blob); // 释放 DOMString ,解除内存占用
}
}
})
.catch((error) => {
console.error(error);
});
}
在使用的页面上引用
import {down_loadfile} from "@/utils/index";
methods: {
openFile(link, name) {
down_loadfile(link, name,1);
},
}
1.第三个参数type不传值的时候只下载。
2.只有pdf文件格式能在浏览器里预览,其他格式 只能下载。
3. headers: { Authorization: "Bearer " + getToken() }里getToken()是获取的自己本地的token。