React实现java输出流的下载

墨蓝 2022-05-25 07:41 90阅读 0赞

目的：java端是输出流，前端用的react要实现输出流的下载，其中核心代码是模仿url的点击事件

downloader=()=>{
            let that =this;
            let parameter = '?shopID='+that.state.shopID +'&shopName='+that.state.shopName+'&shopTypeName='+that.state.shopTypeName
            +'&agencyId='+that.state.logistics+'&ispass='+that.state.ispass+'&promsaleyearmin='+that.state.promsaleyearmin
            +'&promsaleyearmax='+that.state.promsaleyearmax+'&provinceid='+that.state.provinceid;
            axios({
                method: "get",
                url: url.shopproductinfo.getShopProductInfosFile+parameter,
                headers: {
                    "MSP-AppKey": localStorage.getItem('appKey'),
                    "MSP-AuthKey": localStorage.getItem('auth-key'),
                },
                responseType: 'blob'
            }).then(function(res) {
                const content = res.data
                console.log(res)
                const blob = new Blob([content])
                const fileName = '店面信息.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)
                }
            })
        }