• Java集成Onlyoffice以及安装和使用示例,轻松实现word、ppt、excel在线编辑功能协同操作,Docker安装Onlyoffice


    安装Onlyoffice

    拉取onlyoffice镜像 

    docker pull onlyoffice/documentserver

    查看镜像是否下载完成

    docker images

    启动onlyoffice

    以下是将本机的9001端口映射到docker的80端口上,访问时通过服务器ip:9001访问,并且用 -v 将本机机==/data/aws_s3/file-storage==文件夹挂载到docker的 /var/www/onlyoffice/documentserver/web-apps/wsData文件下,后续直接通过http请求读取对应的文件夹

    docker run -i -t -d -p 9001:80 -v /data/aws_s3/file-storage:/var/www/onlyoffice/documentserver/web-apps/wsData onlyoffice/documentserver

    打开浏览器输入ip:9001,如下图根据自己需要执行测试和自启动命令:


    出现以下页面就安装成功:

    进入容器修改配置:

    docker exec -it 容器ID bash


    示例应用

    一、了解onlyoffice

    ONLYOFFICE Docs是一个开源办公套件,包括文本文档、电子表格和演示文稿的编辑器。它提供以下功能:

    1、创建、编辑和查看文本文档、电子表格和演示文稿;

    2、与其他队友实时协作处理文件;

    3、ONLYOFFICE Docs 还支持用于将您的应用程序与在线办公室集成的WOPI 协议。

    二、前提准备

    搭建安装onlyoffice,具体参考官网地址:

    https://helpcenter.onlyoffice.com/installation/docs-developer-install-ubuntu.aspx?from=api_csharp_example

    配置文档ONLYOFFICE API 文档 - 基本概念

    三、开发进行中

    1、准备一个接口返回config配置文件。

    1. @GetMapping("/config/{fileId}")
    2. @ApiOperation("返回配置信息")
    3. public String getConfig(ModelMap map,@PathVariable String fileId){
    4. //具体业务处理省略
    5. //主要是获取一些信息,用于设置html中的脚本对象config上。
    6. //4、设置视图数据:a、文件类型。b、用户信息。c、文件信息。
    7. map.addAttribute("docType",documentType);
    8. map.addAttribute("user",user);
    9. map.addAttribute("fileManager",fileManager); //将html页面返回回去
    10. return "onlineEdit";
    11. }

    2、准备一个callback接口用于文件保存。

    1. @PostMapping("/saveFile/{fileId}/{fileCode}")
    2. @ApiOperation("在线编辑保存回调接口")
    3. @ResponseBody
    4. public void saveFile(HttpServletRequest request , HttpServletResponse response, @PathVariable String fileId, @PathVariable String fileCode) throws IOException {
    5. PrintWriter writer = response.getWriter();
    6. Scanner scanner = new Scanner(request.getInputStream()).useDelimiter("\\A");
    7. String body = scanner.hasNext() ? scanner.next() : "";
    8. JSONObject jsonObject = JSONObject.parseObject(body);
    9. System.out.println(jsonObject);
    10. //status等于2时表示已经准备好保存
    11. if((Integer) jsonObject.get("status") == 2){
    12. //2、根据返回的Url去下载文件
    13. URL url = new URL((String) jsonObject.get("url"));
    14. java.net.HttpURLConnection connection = (java.net.HttpURLConnection) url.openConnection();
    15. InputStream stream = connection.getInputStream();
    16. //此处获取到的流即是onlyoffice服务下的文件流。
    17. //3、重新上传业务省略
    18. connection.disconnect();
    19. }
    20. writer.write("{\"error\":0}");
    21. }

    3、准备一个html页面。

    1. <!DOCTYPE html>
    2. <html lang="en" style="height: 100%;">
    3. <head>
    4. <meta charset="UTF-8">
    5. <script type="text/javascript" src="https://192.168.53.151:9000/web-apps/apps/api/documents/api.js"></script>
    6. <script type="text/javascript" language="javascript" >
    7. var config = {
    8. "type": "desktop",
    9. "mode": "review",
    10. "documentType": "[[${docType}]]",
    11. "document": {
    12. "title": "[[${fileManager.fileName}]]",
    13. "url": "文件下载地址",
    14. "fileType": "[[${fileManager.fileType}]]",
    15. "key": "[[${fileManager.fileManagerId}]]",
    16. "info": {},
    17. "permissions": {
    18. "comment": true,
    19. "copy": true,
    20. "download": true,
    21. "edit": true,
    22. "print": true,
    23. "fillForms": true,
    24. "modifyFilter": true,
    25. "modifyContentControl": true,
    26. "review": true,
    27. "commentGroups": {}
    28. }
    29. },
    30. "editorConfig": {
    31. "mode": "edit",
    32. "callbackUrl": 回调接口保存文件的地址,
    33. "lang": "zh",
    34. "createUrl": "",
    35. "templates": [
    36. {
    37. "icon": "",
    38. "name": "Blank",
    39. "url": "http://ip地址/OnlineEditorsExampleJava_war_exploded/EditorServlet?fileExt=docx"
    40. },
    41. {
    42. "icon": "http://ip地址/OnlineEditorsExampleJava_war_exploded/css/img/file_docx.svg",
    43. "name": "With sample content",
    44. "url": "http://ip地址/OnlineEditorsExampleJava_war_exploded/EditorServlet?fileExt=docx&sample=true"
    45. }
    46. ],
    47. "user": {
    48. "id": "[[${user.userId}]]",
    49. "name": "[[${user.username}]]"
    50. },
    51. "customization": {
    52. "goback": {
    53. "url": "http://ip地址/OnlineEditorsExampleJava_war_exploded/IndexServlet"
    54. },
    55. "forcesave": false,
    56. "submitForm": false,
    57. "about": true,
    58. "feedback": false
    59. },
    60. "canCoAuthoring": true,
    61. "canUseHistory": true,
    62. "canHistoryClose": true,
    63. "canHistoryRestore": false,
    64. "canSendEmailAddresses": false,
    65. "canRequestEditRights": true,
    66. "canRequestClose": false,
    67. "canRename": false,
    68. "canMakeActionLink": true,
    69. "canRequestUsers": true,
    70. "canRequestSendNotify": true,
    71. "canRequestSaveAs": false,
    72. "canRequestInsertImage": true,
    73. "canRequestMailMergeRecipients": true
    74. },
    75. "width": "100%",
    76. "height": "100%",
    77. "events": {},
    78. "frameEditorId": "iframeEditor"
    79. }
    80. var connectEditor = function () {
    81. new DocsAPI.DocEditor("placeholder", config);
    82. };
    83. if (window.addEventListener) {
    84. window.addEventListener("load", connectEditor);
    85. } else if (window.attachEvent) {
    86. window.attachEvent("load", connectEditor);
    87. }
    88. </script>
    89. <title>在线编辑文档</title>
    90. </head>
    91. <body style="height: 100%; margin: 0;">
    92. <div id="placeholder" style="height: 100%"></div>
    93. </body>
    94. </html>

    更加具体的config对象和回调处理接口内容参考官网:

    https://api.onlyoffice.com/editors/getdocs

    四、测试

    当我调用config接口时,打开不同类型的文件,展示返回html页面如下。

    五、总结

    1、要使用onlyoffice去在线编辑不难,主要是掌握config的配置。

    2、它的一个工作流程:当我打开在线编辑时,接口设置数据返回html页面,并将数据拼接到config上。接着页面会根据config的url地址去下载源文件,最后将内容展示到html上。最后当我们修改完毕关闭了窗口时,会调用callbackurl的接口进行文件保存。
     


    同类产品官网,贴在下面如果大家有好的使用方法可以分享下:

    onlyoffice官网:https://www.onlyoffice.com/

    Api官方地址(英文):https://api.onlyoffice.com/editors/basic

    Api中文地址(中文):https://www.onlyoffice.org.cn/guide/usage-mode.html

    OpenOffice官网:https://www.openoffice.org

    LibreOffice官网:https://www.libreoffice.org


    参考链接:链接1链接(原理)2,链接3


    如果本篇文章对你有帮助的话,很高兴能够帮助上你。

    当然,如果你觉得文章有什么让你觉得不合理、或者有更简单的实现方法又或者有理解不来的地方,希望你在看到之后能够在评论里指出来,我会在看到之后尽快的回复你。

  • 相关阅读:
    2021年软件测试面试题大全
    数据结构--二叉树遍历
    面向目标的多模态情感分析方法
    Linux系统下的zabbix监控平台(单机安装服务)
    springboot整合Mongodb
    ASAN入门参考
    PY32F003F18P单片机概述
    Mysql 备份与恢复
    Spring如何处理线程的并发问题?
    ACWing第十三次课第7讲 类、结构体、指针、引用3. 链表斐波那契数列,替换空格,求1+2+…+n,在O(1)时间删除链表结点,合并两个排序的链表
  • 原文地址:https://blog.csdn.net/chenthe1/article/details/133357994