1.docker部署onlyOffice

1.1拉取最新版onlyOffice镜像

sudo docker pull onlyoffice/documentserver 

1.2运行以下命令运行容器

其中  -v 后的第一部分是挂载自己的linux的哪个目录

# 启动docker容器，默认启动端口为80，可以进行修改 docker run -i -t -d -e TZ="Asia/Shanghai" -p 6831:80 --restart=always \     -v /usr/local/docker/document/logs:/var/log/onlyoffice  \     -v /usr/local/docker/document/data:/var/www/onlyoffice/Data  \     -v /usr/local/docker/document/lib:/var/lib/onlyoffice \     -v /usr/local/docker/document/db:/var/lib/postgresql  onlyoffice/documentserver

运行完容器后开始编写代码

2.前端vue代码：

2.1public文文件夹下index.html引入对应的脚本

其中的ip地址和端口改成自己的

2.2 vue组件代码

 2.3父组件中开始引用

 要记得注册组件

对应的data中的属性：

 openOffice:false,       //参考vabOnlyOffice组件参数配置       option: {         key:"",         url: '',         isEdit: '',         fileType: '',         title: '',         lang: '',         isPrint: '',         user: { id:null,name:''}       },

对应的method中添加方法（这个方法可以在需要的地方引用）：

需要注意的是，这里的ip必须这样填（自己天自己的），因为作为docker运行的onlyoffice，需要这样访问本地linux服务器中的服务程序

注：（自己在本地测试时无法通过localhost进行测试运行）

 modifyTem(row){       this.getFile(row.id)     },     getFile(id) {       this.openOffice =  true       this.show = false       // getAction('/file/selectById', { id: this.id }).then(res => {       this.option.isEdit = true //  https://dsgrcdnblobprod5u3.azureedge.net/catalog-assets/zh-cn/a32a147f-1f69-4fd5-8a39-c25b2a0093e8/tf67429532_wac-987650ec15fa.docx       this.option.lang = 'zh-CN'       this.option.url = 'http://192.168.59.164:8080/notemode/notemodeltypeenum/download/'+id       this.option.title = '笔录模板'       this.option.fileType = 'docx'       this.option.isPrint = false       this.option.user= { id:12,name:'张三'}       this.option.editUrl = "http://192.168.59.164:8080/notemode/notemodeltypeenum/save/"+id       // this,option.key="11111"       // })     },     close() {       this.show = false     },

对应的样式

3.对应的后端代码

1.dowload 方法是作为流进行文件数据的返回

2.save方法是对在线编辑后对于word的保存回调方法，在vue中有对应url回调地址的设置选项

注意：回调的时候，onlyOffice是通过一个地址（url）让你进行去下载。

有一些是测试时的代码，没有删掉，请大家注意甄别。

 @GetMapping("/download/{id}")     public void download(@PathVariable("id")Long id, HttpServletRequest request, HttpServletResponse response) throws Exception {         Notemodeltypeenum notemodeltypeenum = notemodeltypeenumService.selectNotemodeltypeenumByID(id);           String filePath = "/a.docx";           int profileIndex = notemodeltypeenum.getContentStr().indexOf("/profile") + "/profile".length();         String subPath = notemodeltypeenum.getContentStr().substring(profileIndex);          filePath = RuoYiConfig.getProfile()+subPath;          //本地文件 //        String configPath = RuoYiConfig.getAttachPath(); //        filePath = configPath + attachment.getVirtualpath();          File file = new File(filePath);         if (file.exists()) {  //            String filename = attachment.getFilename();             response.setContentType("application/octet-stream");             response.setHeader("Content-Disposition", "attachment;filename=" + URLEncoder.encode("a.docx", "utf-8"));             response.setCharacterEncoding("utf-8");             response.setContentLength((int) file.length());              byte[] buff = new byte[(int) file.length()];             BufferedInputStream bufferedInputStream = null;             OutputStream outputStream = null;             try {                  outputStream = response.getOutputStream();                 bufferedInputStream = new BufferedInputStream(new FileInputStream(file));                 int i = 0;                 while ((i = bufferedInputStream.read(buff)) != -1) {                      outputStream.write(buff, 0, i);                     outputStream.flush();                 }             } catch (IOException e) {                  e.printStackTrace();             } finally {                   try {                      bufferedInputStream.close();                 } catch (IOException e) {                      e.printStackTrace();                 }             }         }     }      @PostMapping("/save/{id}")     public void save(@PathVariable("id")Long id,@RequestParam Map map, HttpServletRequest request, HttpServletResponse response) {         Notemodeltypeenum notemodeltypeenum = notemodeltypeenumService.selectNotemodeltypeenumByID(id);          PrintWriter writer = null;         String body = "";          try {              writer = response.getWriter();             Scanner scanner = new Scanner(request.getInputStream());             scanner.useDelimiter("\\A");             body = scanner.hasNext() ? scanner.next() : "";             scanner.close();         } catch (Exception ex) {              writer.write("get request.getInputStream error:" + ex.getMessage());             return;         }          if (body.isEmpty()) {              throw new GlobalException("ONLYOFFICE回调保存请求体未空");         }          JSONObject jsonObj = JSONObject.parseObject(body);         int status = (Integer) jsonObj.get("status");         int saved = 0;         String key = jsonObj.get("key").toString();         if (status == 2 || status == 3 || status == 6) //MustSave, Corrupted         {              String downloadUri = (String) jsonObj.get("url");             System.out.println(downloadUri);             try {                    String fileName = generateUniqueFileName(extractFileName(notemodeltypeenum.getContentStr()));                 String savePath = RuoYiConfig.getProfile()+"/"+fileName;                 downloadFile(downloadUri,savePath);                  // 更新原数据的文件地址                 String s = replacePathAfterProfile(notemodeltypeenum.getContentStr(), "/" + fileName);                 notemodeltypeenum.setContentStr(s);                 notemodeltypeenumService.updateNotemodeltypeenum(notemodeltypeenum);                } catch (Exception ex) {                  saved = 1;                 ex.printStackTrace();             }         }         writer.write("{\"error\":" + saved + "}");     }       public static void downloadFile(String fileUrl, String saveDir) {         try {             URL url = new URL(fileUrl);             URLConnection connection = url.openConnection();             // 5000 milliseconds is an example timeout value             connection.setConnectTimeout(5000);             connection.setReadTimeout(5000);              try (BufferedInputStream in = new BufferedInputStream(connection.getInputStream());                  FileOutputStream fileOutputStream = new FileOutputStream(saveDir)) {                 byte[] dataBuffer = new byte[1024];                 int bytesRead;                 while ((bytesRead = in.read(dataBuffer, 0, 1024)) != -1) {                     fileOutputStream.write(dataBuffer, 0, bytesRead);                 }             }              System.out.println("File downloaded successfully: " + saveDir);         } catch (IOException e) {             System.out.println("Error downloading the file: " + e.getMessage());             e.printStackTrace();         }     } // //    public static void main(String[] args) { //        downloadFile("https://dsgrcdnblobprod5u3.azureedge.net/catalog-assets/zh-cn/a32a147f-1f69-4fd5-8a39-c25b2a0093e8/tf67429532_wac-987650ec15fa.docx","D:/新建文件夹/87650ec15fa.docx"); //    }         public static String generateUniqueFileName(String originalFilename) {         String fileExtension = ""; // 文件扩展名         int i = originalFilename.lastIndexOf('.');         if (i > 0) {             fileExtension = originalFilename.substring(i);         }         return UUID.randomUUID().toString() + fileExtension; // 生成带有扩展名的唯一文件名     }          public static String extractFileName(String url) {         // 检查url是否为空         if (url == null || url.isEmpty()) {             return "";         }          // 查找最后一个斜杠的位置         int lastIndex = url.lastIndexOf('/');         if (lastIndex == -1) {             return ""; // 如果没有找到斜杠，返回空字符串         }          // 从最后一个斜杠之后的位置开始提取子字符串         return url.substring(lastIndex + 1);     }        public static String replacePathAfterProfile(String url, String newPath) {         if (url == null || url.isEmpty()) {             return url; // 或抛出异常，取决于你的错误处理策略         }          // 找到"profile"后的第一个斜杠的索引         int profileIndex = url.indexOf("/profile");         if (profileIndex == -1) {             return url; // 如果找不到"profile"，返回原始URL         }          // 计算"profile"之后的部分开始的索引         int startReplaceIndex = profileIndex + "/profile".length();          // 构造新的URL         return url.substring(0, startReplaceIndex) + newPath;     }

参考文章：

onlyoffice+vue实现在线预览在线编辑_onlyoffice vue-CSDN博客 

SpringBoot集成onlyoffice实现word文档编辑保存-阿里云开发者社区