// import './mock/index.js'; // 该项目所有请求使用mockjs模拟 去掉mock
页面url下载
- console.log( 'res', res)
- / /token 是使页面不用去登录了
- if (res. file) {
- window. location.href =
- Vue. prototype.$config.VUE_APP_BASE_IDSWAPI +
- Vue. prototype.$config.VUE_APP_IDSW +
- '/service/models/download?action=zip&filepath=' +
- encodeURIComponent(encodeURIComponent(res[ 'file'])) +
- ` &token =${localStorage.getItem( 'inmsToken')} &accessToken =${localStorage.getItem( 'accessToken')}`
- }
responseType: "blob",
let blob = new Blob([response.data], { type: "application/zip" }); //注意是response 或者 response.data
let url = window.URL.createObjectURL(blob); 这三句最重要！！！
- / /普通代码
- axios.post(postUrl, params, {responseType: 'arraybuffer'}). then(res = > {
- / / 创建Blob对象，设置文件类型
- let blob = new Blob([res. data], { type: "application/vnd.ms-excel"})
- let objectUrl = URL.createObjectURL(blob) / / 创建URL
- location.href = objectUrl;
- URL.revokeObjectURL(objectUrl); / / 释放内存
- })
- downloadAll() {
- axios({
- method: "get",
- url: "api/TemplateDownload/GetAllTemplateZIP",
- headers: {
- "content-type": "application/json; charset=utf-8",
- Authorization: Cookies. get( "token") || "",
- },
- responseType: "blob",
- })
- . then((response) = > {
- let blob = new Blob([response. data], { type: "application/zip" });
- let url = window.URL.createObjectURL(blob);
- const link = document.createElement( "a"); / / 创建a标签
- link.href = url;
- link.download = "模板下载"; / / 重命名文件
- link.click();
- URL.revokeObjectURL(url); / / 释放内存
- this.checkList = [];
- })
- .catch(( error) = > {
- console.log( error. data);
- });
- },
- / /excel
- let blob = new Blob([response. data], { type: "application/vnd.ms-excel" });
- dl() {
- axios({
- method: "get",
- url: "http://10.180.170.3:8794/tRptMwStdClt/exportData?time=202104",
- responseType: "arraybuffer",
- })
- . then((response) = > {
- console.log(response);
- let blob = new Blob([response. data], {
- type: "application/vnd.ms-excel",
- });
- let url = window.URL.createObjectURL(blob);
- const link = document.createElement( "a"); / / 创建a标签
- link.href = url;
- link.download = "模板下载"; / / 重命名文件
- link.click();
- URL.revokeObjectURL(url); / / 释放内存
- this.checkList = [];
- })
- .catch(( error) = > {
- console.log( error. data);
- });
- },
获取到了后台传过来的excel文件 前端用vue怎么接收并导出？ - 中文 - Vue Forum
vue.js前端实现excel表格导出和获取headers里的信息 - 五个半柠檬 - OSCHINA - 中文开源技术交流社区
java后台需要设置
- response.addHeader( "Content-Disposition", "attachment;filename=" + fileName + ".xlsx");
- response.setHeader( "Access-Control-Expose-Headers", "Content-Disposition");
- 才能获取到文件名等信息
- / / 导出execel 2
- handleExcel() {
- this.$http({
- url: this.$http.adornUrl(url),
- method: "post",
- responseType: "blob", / /!!!!
- params: this.$http.adornParams({
- userAccount: this.userName,
- }),
- }). then((res) = > {
- / / console.log(res, "res");
- let blob = new Blob([res. data], { type: "application/vnd.ms-excel" });
- let fileName = decodeURI(
- response.headers[ "content-disposition"].split( ";")[ 1].split( "=")[ 1]
- );
- let url = window.URL.createObjectURL(blob);
- const link = document.createElement( "a"); / / 创建a标签
- link.href = url;
- link.download = fileName; / / 重命名文件
- link.click();
- URL.revokeObjectURL(url); / / 释放内存
- });
- },