vue 下载模版文件

使用axios下载blob文件及Spring接口实现

最新推荐文章于 2024-09-14 16:29:31 发布

原创最新推荐文章于 2024-09-14 16:29:31 发布 · 726 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #vue

Spring 同时被 2 个专栏收录

54 篇文章

订阅专栏

vue

19 篇文章

订阅专栏

从后台接口中返回的类型是 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();
        }
    }