前后端分离项目集成PageOffice——实现在线编辑Word文件的版本控制

response_L

已于 2022-12-02 09:04:50 修改

阅读量447

点赞数

分类专栏： pageoffice 文章标签： word spring boot vue

于 2022-12-01 11:12:19 首次发布

本文链接：https://blog.csdn.net/qq_44306545/article/details/128128011

版权

pageoffice 专栏收录该内容

10 篇文章 1 订阅

订阅专栏

说明：

PageOffice本身提供了SaveFilePage的js方法，但是由于该方法不支持代理且不能跨域导致在前后端分离项目中无法使用

功能：实现三个按钮分别保存不同版本的文件

1、PageOffice可以通过input隐藏域给保存方法传递参数，在页面定义一个input隐藏域并通过按钮给隐藏域赋值。

Word.vue页面

<template>
	<div class="Word">
		<input type="button" value="定稿" @click="SaveWord('定稿')"/>
        <input type="button" value="保存模板" @click="SaveWord('模板')"/>
        <input type="button" value="保存文件" @click="SaveWord('正式文件')"/>
        <input type="hidden" id="SaveVerison" value=""/>

		<div style="height: 800px; width: auto" v-html="poHtmlCode" />
	</div>
</template>

SaveWord(str){
      document.getElementById("SaveVerison").value = str;
      document.getElementById("PageOfficeCtrl1").WebSave();
    }

2、后端保存文件的方法中获取隐藏域的值(fs.getFormField()之前获取的是Form控件的name，后来改为id了，我用的是5.4.0.3版本获取的是id)，通过判断，保存文件到对应版本目录下。fs.getFileExtName()是获取文件后缀名

@RequestMapping("save")
    public void save(HttpServletRequest request, HttpServletResponse response) {
        FileSaver fs = new FileSaver(request, response);
        String SaveVerison = fs.getFormField("SaveVerison");
        if(SaveVerison.equals("定稿")){
            fs.saveToFile("G:\\doc\\test_doc\\"+SaveVerison+fs.getFileExtName());
        }else if(SaveVerison.equals("模板")){
            fs.saveToFile("G:\\doc\\template_doc\\"+SaveVerison+fs.getFileExtName());
        }else if(SaveVerison.equals("正式文件")){
            fs.saveToFile("G:\\doc\\formal_doc\\"+SaveVerison+fs.getFileExtName());
        }
        fs.close();
    }