java+vue实现富文本转word下载到本地

最新推荐文章于 2024-10-11 16:04:42 发布

月慕向阳

最新推荐文章于 2024-10-11 16:04:42 发布

阅读量1.2k

点赞数

分类专栏： java vue

原文链接：https://blog.csdn.net/qq_44382452/article/details/110001444

版权

java 同时被 2 个专栏收录

40 篇文章 0 订阅

订阅专栏

vue

9 篇文章 0 订阅

订阅专栏

该博客展示了如何使用Java后端和JavaScript前端配合实现Word文档的导出和下载功能。后端通过POIFSFileSystem库处理HTML内容并转化为Word文档，前端利用axios库发送请求并处理响应以下载文件。主要涉及的技术包括：Java API操作、HTTP响应头设置、文件流处理及Blob对象在JavaScript中的应用。

摘要由CSDN通过智能技术生成

java

@ApiOperation("word导出")
    @RequestMapping(value = "/exportWord")
    public void exprotWord(@RequestParam String id, HttpServletRequest request,
                           HttpServletResponse response) {
        // 数据库查富文本数据
        String content = this.richTextService.getById(id).getContent();
        String richText = "<html><body>" + content + "</body></html>";
        try {
            //设置编码
            byte b[] = richText.getBytes("GBK");
            ByteArrayInputStream bais = new ByteArrayInputStream(b);
            POIFSFileSystem poifs = new POIFSFileSystem();
            // ##############下面这两个不能删掉
            DirectoryEntry directory = poifs.getRoot();
            DocumentEntry documentEntry = directory.createDocument("WordDocument", bais);
            //################这两个不能删掉
            //输出文件
            String name = "测试";
            response.reset();
            response.setHeader("Content-Disposition",
                    "attachment;filename=" +
                            new String(name.getBytes("GB2312"), "iso-8859-1") + ".doc");
            response.setContentType("application/msword");
            OutputStream ostream = response.getOutputStream();
            //输出到本地文件的话，new一个文件流
            // FileOutputStream ostream = new FileOutputStream("E:\\桌面\\测试.doc");
            poifs.writeFilesystem(ostream);
            bais.close();
            ostream.close();
        } catch (Exception e) {
            e.printStackTrace();
        }

    }

js实现下载word

/*
export function downFile(url,parameter){
  return axios({
    url: url,
    params: parameter,
    method:'get' ,
    responseType: 'blob'
  })
}
 */
handleSubmit(e) {
        var fileName = "群体性事件"
        var param = {"id":"2"}
        //downFile就是封装了axios
        downFile(this.url.exportWord, param).then((res) => {
          if (typeof window.navigator.msSaveBlob !== 'undefined') {
            window.navigator.msSaveBlob(new Blob([res], {
            type: 'application/msword'
          }), fileName + '.doc')
          } else {
            let url = window.URL.createObjectURL(new Blob([res], {
              type: 'application/msword'
            }))
            let link = document.createElement('a')
            link.style.display = 'none'
            link.href = url
            //这是下载的文件名
            link.setAttribute('download', fileName + '.doc')
            document.body.appendChild(link)
            link.click()
            document.body.removeChild(link); //下载完成移除元素
            window.URL.revokeObjectURL(url); //释放掉blob对象
          }
        }).catch((err) => {
          console.log(err)
        })
      }