vue 下载模版文件

19 篇文章 0 订阅

 从后台接口中返回的类型是 blob

download() {
        let params = {

        }
        this.$axios({
            method: 'get',
            responseType: 'blob', //防止返回乱码
            url: this.baseUrl + '/download/template',
            params: params
        }).then(res => {
            if (res.status == '200') {
                // downloadFile (data, name)
                let data = res.data;
                if (!data) {
                    this.$message.error('下载失败,解析数据为空!')
                    return
                }
                // const datetime = Date.now();
                // 创建一个新的url,此url指向新建的Blob对象
                let url = window.URL.createObjectURL(new Blob([data]))

                // 创建a标签,并隐藏改a标签
                let link = document.createElement('a')
                link.style.display = 'none'

                let fileName = 'test' + '.xlsx'
                document.body.appendChild(link);

                // a标签的href属性指定下载链接
                link.href = url

                // 或者用setAttribute() 方法添加指定的属性,并为其赋指定的值。
                link.download = fileName

                link.click();
                link.remove();
            } else {
                this.$message.error('导出失败,请尝试重新导出');
            }
        });
    },

spring 接口

    @ApiOperation(value = "获取模版")
    @GetMapping("/dl/template")
    public void downloadExcel() {
        try {
            //获取文件的路径
            String tplUrl = "";
            ResponseEntity<byte[]> reportEntity = null;

            InputStream reportStream = new ByteArrayInputStream(reportEntity.getBody());

            // 设置输出的格式
            servletResponse.reset();
            servletResponse.setContentType("bin");
            servletResponse.addHeader("Content-Disposition",
                    "attachment;filename=" + URLEncoder.encode("test.xls", "UTF-8"));
            // 循环取出流中的数据
            byte[] b = new byte[200];
            int len;
            while ((len = reportStream.read(b)) > 0) {
                servletResponse.getOutputStream().write(b, 0, len);
            }
            reportStream.close();
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值