一种流式文档在线编辑方法.pdf

(19)中华人民共和国国家知识产权局(12)发明专利申请(10)申请公布号CN113723064A(43)申请公布日2021.11.30(21)申请号202111279355.5(22)申请日2021.11.01(71)申请人冠群信息技术（南京）有限公司地址210000江苏省南京市江北新区星火路17号创智大厦B座11层(72)发明人许剑锋(74)专利代理机构重庆百润洪知识产权代理有限公司50219代理人陈万江(51)Int.Cl.G06F40/166(2020.01)G06F40/14(2020.01)H04L29/08(2006.01)权利要求书1页说明书3页附图2页(54)发明名称一种流式文档在线编辑方法(57)摘要本发明涉及数据处理技术领域，尤其涉及一种流式文档在线编辑方法；包括在线编辑和协同编辑两种方式，在线编辑通过浏览器端打开流式文档，具体是通过JavaScript直接对流式文档进行格式转化；再通过监听光标变化和事件，操作虚拟dom树，改变数据层，渲染真实dom树；协同编辑具体在多个不同的浏览器端打开同一文档并且同时连接websocket服务；编辑器监听所有用户的原子化操作，生成的相应的原子化操作数据；由websocket接收并广播到所有的在线编辑的浏览器端。本发明有效的减少前后端之间的通信消耗，避免受到网络环境的影响。CN113723064ACN113723064A权利要求书1/1页1.一种流式文档在线编辑方法，其特征在于：包括在线编辑和协同编辑两种方式，所述的在线编辑具体按以下步骤执行：S1:通过浏览器端打开流式文档，具体是通过JavaScript直接对流式文档进行格式转化；S2:通过监听光标变化和事件，操作虚拟dom树，改变数据层，渲染真实dom树；所述的协同编辑具体按以下步骤执行：1):在多个不同的浏览器端打开同一文档并且同时连接websocket服务；2):编辑器会监听所有用户的原子化操作，生成的相应的原子化操作数据；3):由websocket接收并广播到所有的在线编辑的浏览器端；4):服务器端接收原子操作数据时，存储到对应的数据库中；5):所有在线编辑浏览端均通过websocket接口同步接收原子操作数据；6):根据原子操作数据操作虚拟dom树，本地自动将原子化操作数据通过数组的方式进行序列化存储处理，再和服务器端的数据进行比对；7):将虚拟dom树渲染成真实dom树。2.根据权利要求1所述的一种流式文档在线编辑方法，其特征在于：在步骤S1中，具体按以下步骤执行：S1.1:调用前端压缩解压的类库JSZip，将流式文档转化为JSZip对象；S1.2:按照流式文档的标准定义，构建核心类库，将json格式的数据层转化利于浏览器渲染的虚拟dom树。3.根据权利要求1所述的一种流式文档在线编辑方法，其特征在于：在步骤2)‑步骤7)中，首先设置A操作端是授权用户，进行编辑操作，并监听所有用户的原子化操作，生成原子化操作数据；其它浏览器接收websocket传输的原子化操作数据。4.根据权利要求1所述的一种流式文档在线编辑方法，其特征在于：在步骤2)中，原子化操作数据包括自增操作序号，操作类型，对象路径，开始位置，结束位置和操作内容；编辑器自身自动缓存最后一次操作序号；2.1)：编辑器首先判断接收到的操作序号是否为本地缓存的操作序号的自增序号；如果是，则根据对象路径在虚拟dom树上的对应节点，接着根据操作类型调用对应的操作方法，然后依据开始位置和结束位置和操作内容对虚拟dom树的节点进行操作；2.2)：服务器端在websocket接收原子化操作数据存储到数据库，同时浏览器端在websocket接收原子化操作数据后，存储在本地，以数组的方式进行序列化；2.3)：当发现操作序号不是自增时，调用api接口，接收到服务器端的原子化操作数据，与本地的原子化操作数组进行比较，按照diff算法进行整合，然后进行transform操作。5.根据权利要求1所述的一种流式文档在线编辑方法，其特征在于：所述的协同编辑在步骤2)中利用OT算法，通过监听事件，获取用户的原子化操作。2CN113723064A说明书1/3页一种流式文档在线编辑方法技术领域[0001]本发明涉及数据处理技术领域，尤其涉及一种流式文档在线编辑方法。背景技术[0002]流式文档：指对文档包含的文字、数字、表格和图形图像进行特定的版排方式处理，保存后的内容是原始的编辑元素，用户通过阅读软件能查看到编辑后的排版风格，并且可以在不同的缩放比率间自适应版面大小显示，如Word、WPS。在线编辑器：一种通过浏览器对文字、图片等内容进行在线编辑修改的工具。一般所指的在线编辑器是指HTML编辑器。目前流式文档在线编辑器主要是谷歌文档和金山在线文档。其它如腾讯文档、飞书等在线编辑器更多