OnlyOffice基础实践

一：概述

onlyoffice是做什么用的在这里就不做解释了，能看到这篇博客的我相信都是了解的，本文主要讲解onlyoffice在使用过程中要注意的问题。

使用环境：window10 + VMware Workstation Pro14 + CentOS-7-x86_64-Minimal + Docker 18.03.1-ce + onlyoffice

onlyoffice官网：https://www.onlyoffice.com/
onlyoffice API： https://api.onlyoffice.com/editors/basic

onlyoffice API要着重看下，里面阐述了onlyoffice的运行原理，同时里面有基于多种语言的样例代码，基本理解onlyoffice的运行原理后再结合样例代码验证必能事半功倍。在这首先阐述下API中设计到的几个概念：
1，document manager ： 文档管理器，等同于一个界面中的文件列表，该列表就是文档管理器【我们自己编写，不一定需要】。
2，document storage service ：文档存储服务，即管理文档存放的模块，很多时候就是我们上传文件然后将其保存在服务器上，网上也有使用nextcloud作为存储的【我们自己编写或使用存储文件的软件】。
3，document editor ： 文档编辑器，就是文档编辑窗口【onlyoffice提供的前端页面插件】
4，document editing service ： 文档编辑服务，从文档存储服务获取要编辑的文档，转换成Office OpenXML格式后传给文档编辑器，编辑期间文档编辑器与文档编辑服务长期交互【onlyoffice提供的后台服务】

二：实践（基于样例代码）
首先从官网下载基于java开发的样例代码“Java Example.zip”，该代码是使用maven构建的webapp，在webapp目录下有两个文件“index.jsp”和"editor.jsp"; 同时在resources目录下有个setting.properties配置文件，这三个文件是我们首先要着重看的地方。

如果index.jsp能顺利运行起来，那界面应该是这样的：

首先我们可以点击“Choose file”按钮上传一个要编辑的文件，这时会调用 controllers.IndexServlet中的doPost方法。其处理方法为：

protected void proce***equest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException
    {
        String action = request.getParameter("type");
        if(action == null)  {
            request.getRequestDispatcher("index.jsp").forward(request, response);
            return;
        }
        DocumentManager.Init(request, response);
        PrintWriter writer = response.getWriter();
        switch (action.toLowerCase())
        {
            case "upload":
                Upload(request, response, writer);
                break;
            case "convert":
                Convert(request, response, writer);
                break;
            case "track":
                Track(request, response, writer);
                break;
        }
    }
private static void Upload(HttpServletRequest request, HttpServletResponse response, PrintWriter writer)
    {
        response.setContentType("text/plain");
        try
        {
            Part httpPostedFile = request.getPart("file");
            String fileName = "";
            for (String content : httpPostedFile.getHeader("content-disposition").split(";"))
            {
                if (content.trim().startsWith("filename"))
                {
                    fileName = content.substring(content.indexOf('=') + 1).trim().replace("\"", "");
                }
            }
            long curSize = httpPostedFile.getSize();
            if (DocumentManager.GetMaxFileSize() < curSize || curSize <= 0)
            {
                writer.write("{ \"error\": \"File size is incorrect\"}");
                return;
            }
            String curExt = FileUtility.GetFileExtension(fileName);
            if (!DocumentManager.GetFileExts().contains(curExt))
            {
                writer.write("{ \"error\": \"File type is not supported\"}");
                return;
            }
            InputStream fileStream = httpPostedFile.getInputStream();
            fileName = DocumentManager.GetCorrectName(fileName);
                        //文件保存路径
            String fileStoragePath = DocumentManager.StoragePath(fileName, null);
 
            File file = new File(fileStoragePath);
            try (FileOutputStream out = new FileOutputStream(file))
            {
                int read;
                final byte[] bytes = new byte[1024];
                while ((read = fileStream.read(bytes)) != -1)
                {
                    out.write(bytes, 0, read);
                }
                out.flush();
            }
            writer.write("{ \"filename\": \"" + fileName + "\"}");
        }
        catch (IOException | ServletException e)
        {
            writer.write("{ \"error\": \"" + e.getMessage() + "\"}");
        }
    }

深入的不在阐述，经过几番周折后，最终是将文件保存在硬盘上。这个上传操作在实际应用onlyoffice的项目中也应该会有，实现方法和存放的路径根据实际调整即可。

上传过程界面如下：

当点击“Edit”按钮后，将会通过EditorServlet跳转到“editor.jsp页面”，并将需要的参数传递过去。其中关键的代码为

docEditor = new DocsAPI.DocEditor("iframeEditor",
                {
                    width: "100%",
                    height: "100%",
                    type: "${type}",
                    documentType: "<%= Model.GetDocumentType() %>",
                    document: {
                        title: fileNam