前端导出后端生成的Excel文件,报错:文件格式和扩展名不匹配,文件可能已损坏

前端导出部分:

带参数的话可以把参数写在url里:const baseURL=`/api/export.json?id=${id}`

fetch(`${baseURL}/`, { // downloadFiles 接口请求地址

      method: 'post',

      credentials: 'include',

      headers: new Headers({

        'Content-Type': 'application/json',//application/octet-stream 接收二进制类型 不限制文件格式

        // 'X-Auth-Token': User.getToken(),//设置header 获取token

      }),

    }).then((response) => {

      console.info(response);

      response.blob().then((blob) => {

        const blobUrl = window.URL.createObjectURL(blob);

        const aElement = document.createElement('a'); // 获取a标签元素

        aElement.style = {

          display: 'none',

        };

        const filename = 'deviceTemplet.xlsx';// 设置文件名称

        aElement.href = blobUrl;// 设置a标签路径

        aElement.download = filename;

        aElement.click();

        window.URL.revokeObjectURL(blobUrl);

        aElement.remove();

      });

后端返回的是Excel文件
前端遇到的问题:报错:文件格式和扩展名不匹配,文件可能已损坏
                             会提示丢失umi.css(但是前端和后端均没有这个文件)
                             解决的过程中怀疑过Content-Type 但是无论后端怎么设置 前端在控制台这个接口的response里看到的都是Content-Type:text/html
解决:本地代理出现了问题 少了/api应该加上  平常项目里面用的dva bigfish里面配置了代理/api被取代掉  所以要在平常的接口前面加上/api 也就是要检查实际的接口url是否正确

你可能感兴趣的:(前端导出后端生成的Excel文件,报错:文件格式和扩展名不匹配,文件可能已损坏)