gogogo
管理员
管理员
  • UID25
  • 粉丝0
  • 关注0
  • 发帖数1384
阅读:3246回复:0

JS处理文件流

楼主#
更多 发布于:2021-12-14 10:04
最近做一个项目,遇到了一个问题,就是导出Excel功能。多普通呀,多大众化,哪里都有,可惜我们后台说给我JSON数据,自己处理。我果断拒绝了,拒绝的里有是我菜,实现不了啊。然后后台开发看不下去了,就是转成文件流给我吧。他们那里是分布式部署,也没有办法持久化存储。遂发生了一下的故事

分两步:
一:封装接口调用方法
const requestFileDown = (method, url, params) => {
    return axios({
        method: method,
        url: url,
        headers: {
            'Content-Type': 'application/json',
            'token': Vue.ls.get(ACCESS_TOKEN),
        },
        data: params,
       responseType: 'blob'
   }).then(res => res.data);
};




二、封装接口调用方法


//预警消息生成 下载查询结果excel

export function yjdownFileExcel(obj){

    return requestFileDown('post', '/productSafe/warningIndex/excelexport', obj)

}



三、调用接口 下载 excel

    downFileExcel(rInfo).then(res => {

         if (res) {
                //console.log(res);


        const content = res
          const blob = new Blob([content])

         //console.log(blob)

         const fileName = "data.xls"

        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)
} } else {

        this.$message({
                    message: '下载失败!',
                    type: 'error'
                })
            }

})
游客


返回顶部