zoukankan      html  css  js  c++  java
  • axios 请求 下载csv文件,出现中文乱码的情况解决

    一般vue项目,我们会封装好axios请求,,和后端约定好,对返回也做好处理,当遇上下载文件时,后端直接返回二进制文件流,需要我们自己在拦截器先设置好返回数据的格式

    
    
    // interceptors 拦截器,统一处理接口的响应和错误
    // 特殊处理 - 下载附件直接返回了二进制流

    AxiosInstance.interceptors.response.use( (response)
    => { // TODO; 完善逻辑 requestMap.delete(response.config.requestKey); if (response.config.url.includes('下载文件的url')) { //response.data 直接返回的就是二进制流,如下high,test22,"test1,test2,test3",10.2.26.13,这是一个漏洞,这是一个 let data = { code: 200, data: response.data }; response.data = data; } const { code, error, message } = response.data || {}; if (code !== 200) { switch (code) { // 未认证 case 401: logoutResponse(); // 取消所有请求 clearAllRequest('未认证'); break; case 502: Notification.error(messageMap[code]); break; default: Notification.error({ title: error || code, message }); break; } return Promise.reject(error); } return response; }, (error) => { console.error('响应错误拦截', error); Notification.closeAll(); // 判断是否为主动取消的请求 如果是 就不用提示 if (!axios.isCancel(error) && error.message) { buildErrorResponse(error); } return Promise.reject(error); } );


    请求页面
    async downLoadFile(data) { let params
    = { attachmentId: data.id }; await reqDownloadAttachment(params) .then((row) => { let resData = row.data; const blob = new Blob([resData], { type: 'text/csv,charset=UTF-8' }); const fileName = data.name; 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); // 释放URL 对象 document.body.removeChild(elink); } else { // IE10+下载 navigator.msSaveBlob(blob, fileName); } }) .catch((error) => { }); },

    原本我请求的时候,对请求参数中  设置  responseType: 'blob',

    结果发现下载下来的文件中文乱码

    怎么修改也不行,最后发现了,不设置 responseType: 'blob',,并且在  downLoadFile函数中

    let resData ='ufeff' + row.data;
       const blob = new Blob([resData], {
            type: 'text/csv,charset=UTF-8'
        });
    成功!!!  关键点是在返回的data 上加上'ufeff'
  • 相关阅读:
    convert image to base64 and post to RESTful wcf
    在android webview实现截屏的手动tounchmove裁剪图片
    How to use jquery ajax and android request security RESTful WCF
    using swfUpload in asp.net mvc
    using HttpClient and sending json data to RESTful server in adroind
    ODP.NET数据访问
    android image watermark
    解决国内不能访问github的问题
    idapro权威指南第二版阅读笔记第九章 交叉引用和绘图功能
    idapro权威指南第二版阅读笔记第二章 逆向和反汇编工具
  • 原文地址:https://www.cnblogs.com/fyjz/p/15262282.html
Copyright © 2011-2022 走看看