将 ONLYOFFICE 文档编辑器与 Node.js 应用集成
我们来了解下,如何将 ONLYOFFICE 文档编辑器与您的 Web 应用集成。

许多 Web 应用都可以从文档编辑功能中获益。但是要从头开始创建这个功能,需要花费大量时间和精力。幸运的是,您可以使用 ONLYOFFICE——这是一款开源办公套件,可用于第三方应用,作为处理文档、电子表格和演示文稿编辑组件。
在本文中,我们会向您展示如何为任意 Node.js 应用添加文档编辑功能。我们会使用 ONLYOFFICE 平台上最简单的文档管理系统,向您展示具体操作方法。
ONLYOFFICE 能为您的应用带来什么
- 编辑文本文档、电子表格、演示文稿、PDF 等办公文档
- 支持 AI 集成,也提供两款现成的 AI 助手
- 与微软 Office 高度兼容
- 转换文档,支持 PDF 转 DOCX 等操作
- 多人实时协同编辑功能
- 丰富的宏和插件库,支持自行开发上传
- 自定义界面,白标产品
那么,我们开始行动吧。
安装 ONLYOFFICE 文档服务器
ONLYOFFICE 文档服务器包含几种编辑器。在将编辑器与您的应用集成之前,您要将编辑器部署到您的机器上。最简单的安装方法是使用 Docker:
docker run -itd -p 8080:80 onlyoffice/documentserver
文档服务器的地址为 0.0.0.0:8080。
授予文件访问权限
如要在您的应用中使用编辑器,您需要有打开和编辑文件的权限。
为演示如何访问这些文件,我们使用 express 框架开发的一个简单的 Node.js 应用。这个应用使用端口 3000。
在 GET 请求被发送至 http://localhost:3000/ 时,系统会返回文件 index.html。“文件”文件夹中包含公共文件,可在 http://localhost:3000/filename 获取。
const express = require('express');const path = require('path');const app = express();app.use(express.static('files'));app.get('/', (req, res) => {res.sendFile(path.join(__dirname + '/index.html'))});app.listen(3000 , () => console.log(`Example app listening on port ${port}!`));
如何打开文档进行查看
打开 index.html 文件,连接到文档服务器 API。您需要添加三个按钮——用于打开文本文档、电子表格和演示文稿。
编辑器会被在带有占位符 ID 的元素中打开。
<script type="text/javascript" src="http://0.0.0.0:8080/web-apps/apps/api/documents/api.js"></script><button onclick="open_to_view('1.docx', 'text')">1.docx view</button><button onclick="open_to_view('1.xlsx', 'spreadsheet')">1.xlsx view</button><button onclick="open_to_view('1.pptx', 'presentation')">1.pptx view</button><div id="placeholder"></div><script>function open_to_view(filename, documentType) {// Close the editors if they are open.if (this.docEditor) {
this.docEditor.destroyEditor()
}// Add the link to the file you want to openconst url = window.location.protocol + "//" +window.location.hostname + ':' + window.location.port + '/' + filename;// Create DocsAPI object and open the editorthis.docEditor = new DocsAPI.DocEditor("placeholder",{documentType: documentType,document: { url: url },editorConfig: { mode: "view" }});}</script>
完成上述操作后,点击其中一个按钮,即可在 ONLYOFFICE 中打开文件进行查看。
如何打开文件进行编辑
现在,您需要再添加三个用于编辑文件的按钮。然后,写一个新函数 open_to_edit()。它看起来很像 open_to_view() 函数,只是没有 editorConfig。
<button onclick="open_to_edit('1.docx', 'text')">1.docx view</button><button onclick="open_to_edit('1.xlsx', 'spreadsheet')">1.xlsx view</button><button onclick="open_to_edit('1.pptx', 'presentation')">1.pptx view</button><script>function open_to_edit(filename, documentType) {if (this.docEditor) {
this.docEditor.destroyEditor()
}const url = window.location.protocol + "//" +
window.location.hostname + ':' + window.location.port + '/' + filename;this.docEditor = new DocsAPI.DocEditor("placeholder", {documentType: documentType,document: { url: url }});}</script>
这样,您就可以打开文件进行编辑了。但这还不够,因为我们还想保存文件。我们来添加这个功能。
如何保存文件
现在,我们来编写最基本的回调处理程序,用于将文件保存到服务器。
app.post("/track", function (req, res) {// status 2 means that the files is ready for saving.
// More information about statuses can be found in our API documentation
if (req.body.status === 2) {const file = syncRequest("GET", req.body.url);fs.writeFileSync(__dirname + '/files/' + req.query.fileName, file.getBody());// {"error": 0} you need to get this response from your storage,//it means no errors occurred. Detailsres.write("{\"error\":0}");res.end();// do not do anything about other responses} else {res.write("{\"error\":0}");res.end();}
});
这就是将 ONLYOFFICE 编辑器与您的应用集成所需的最基本的操作了。您可以查看 ONLYOFFICE API 文档,了解更多信息。
ONLYOFFICE 编辑器几乎可以与所有编程语言编写的 web 应用集成。如要了解更多关于 .Net (C# MVC)、.Net (C#)、Java、PHP 和 Ruby 的集成示例,可在 GitHub 上查看。有关集成到 Python 应用的文章也很快会发布。
许可呢?
ONLYOFFICE 采用双许可模式。这意味着,只要遵从 GNU AGPL v.3 许可,就可以使用 GitHub 上的 ONLYOFFICE 开源解决方案。ONLYOFFICE 有许多成功的集成案例,包括与 ownCloud, Nextcloud, Moodle 和 eХo Platform 的集成。
如要将 ONLYOFFICE 编辑器作为 SaaS 或本地服务的一部分使用,您需要获得商业许可。在商用方面,ONLYOFFICE 也有诸多成功案例。例如,中国知网集成 ONLYOFFICE,让客户在 CNKI 系统中实现文件在线预览。或者,南京大学e-Science中心将 ONLYOFFICE文档集成到协同表格工具中,从而改进教师检查、评阅和打分学生作业的流程。
相关文章
开发者版 ONLYOFFICE 文档 7.5:API 和文档生成器更新
将 ONLYOFFICE 文档编辑器与 С# 群件平台集成
使用 Ruby 语言来解析开放文档格式 OOXML 文件
如何将 ONLYOFFICE 协作空间与单页面应用集成
如何采用WOPI协议将Office整合到自己项目中
相关文章:
将 ONLYOFFICE 文档编辑器与 Node.js 应用集成
我们来了解下,如何将 ONLYOFFICE 文档编辑器与您的 Web 应用集成。 许多 Web 应用都可以从文档编辑功能中获益。但是要从头开始创建这个功能,需要花费大量时间和精力。幸运的是,您可以使用 ONLYOFFICE——这是一款开源办公套件,可…...
CentOS 7搭建Gitlab流程
目录 1、查询docker镜像gitlab-ce 2、拉取镜像 3、查询已下载的镜像 4、新建gitlab文件夹 5、在gitlab文件夹下新建相关文件夹 6、创建运行gitlab的容器 7、查看docker容器 8、根据Linux地址访问gitlab 9、进入docker容器,设置用户名的和密码 10、登录git…...
Idea安装完成配置
目录: 环境配置Java配置Maven配置Git配置 基础设置编码级设置File Header自动生成序列化编号配置 插件安装MyBtisPlusRestfulTooklkit-fix 环境配置 Java配置 Idea右上方,找到Project Settings. 有些版本直接有,有些是在设置下的二级菜单下…...
超详细~25考研规划~感恩现在努力的你!!!
25考研规划 俄语,翻译过来叫我爱你 考试时间 第一天 8.30-11.30政治——100分 2.00-5.00英语——100分 第二天 8.30-11.30数学——150分 2.00-5.00专业课——150分 1.什么是25考研 将在2024年12月参加考研,2025年本科毕业,9月读研究…...
智慧城市安全监控的新利器
在传统的城市管理中,井盖的监控一直是一个难题,而井盖异动传感器的出现为这一问题提供了有效的解决方案。它具有体积小、重量轻、安装方便等特点,可以灵活地应用于各种类型的井盖,实现对城市基础设施的全方位监控。 智能井盖监测终…...
【算法】石子合并(区间dp)
题目 设有 N 堆石子排成一排,其编号为 1,2,3,…,N。 每堆石子有一定的质量,可以用一个整数来描述,现在要将这 N 堆石子合并成为一堆。 每次只能合并相邻的两堆,合并的代价为这两堆石子的质量之和,合并后与这两堆石子…...
C++-特殊类和单例模式
1.请设计一个类,不能被拷贝 拷贝构造函数以及赋值运算符重载,因此想要让一个类禁止拷贝,只需让该类不能调用拷贝构造函数以及赋值运算符重载即可。 //该类不能发生拷贝class NonCopy{public:NonCopy(const NonCopy& Nc) delete;NonCopy&…...
【开源】基于Vue.js的智能教学资源库系统
项目编号: S 050 ,文末获取源码。 \color{red}{项目编号:S050,文末获取源码。} 项目编号:S050,文末获取源码。 目录 一、摘要1.1 项目介绍1.2 项目录屏 二、功能模块2.1 数据中心模块2.2 课程档案模块2.3 课…...
C语言之qsort()函数的模拟实现
C语言之qsort()函数的模拟实现 文章目录 C语言之qsort()函数的模拟实现1. 简介2. 冒泡排序3. 对冒泡排序进行改造4. 改造部分4.1 保留部分的冒泡排序4.2 比较部分4.3 交换部分 5. bubble_sort2完整代码6. 使用bubble_sort2来排序整型数组7. 使用bubble_sort2来排序结构体数组7.…...
数字化未来:实时云渲染在智慧城市中的创新应用
数字中国战略"是国家推动数字经济发展的战略框架。这个战略旨在加速数字化转型,推动信息技术在各个领域的应用,提高社会经济效益和人民生活质量。而智慧城市作为其中的重要一环,重要性不言而喻。 智慧城市是当今城市发展的热点和趋势&a…...
Go语言常用命令详解(二)
文章目录 前言常用命令go bug示例参数说明 go doc示例参数说明 go env示例 go fix示例 go fmt示例 go generate示例 总结写在最后 前言 接着上一篇继续介绍Go语言的常用命令 常用命令 以下是一些常用的Go命令,这些命令可以帮助您在Go开发中进行编译、测试、运行和…...
ChatGPT 从零到一打造私人智能英语学习助手
近几年,随着智能化技术的发展和人工智能的兴起,越来越多的应用程序开始涌现出来。在这些应用中,语音识别、自然语言处理以及机器翻译等技术都得到了广泛的应用。其中,聊天机器人成为了最受欢迎的人工智能应用之一,它们…...
算法升级之路(七)-盛最多水的容器
给定一个长度为 n 的整数数组 height 。有 n 条垂线,第 i 条线的两个端点是 (i, 0) 和 (i, height[i]) 。 找出其中的两条线,使得它们与 x 轴共同构成的容器可以容纳最多的水。 返回容器可以储存的最大水量。 原题链接: 盛最多水的容器 解题思路&…...
milvus数据库索引管理
一、建立向量索引 默认情况下,Milvus不会对小于1,024行的段进行索引。 1.准备索引参数 index_params {"metric_type":"L2","index_type":"IVF_FLAT","params":{"nlist":1024} } #"nlist"…...
JVM中的 -Xms参数 设置 JVM 的初始堆大小
在 Java 虚拟机(JVM)的配置中,-Xms 是一个启动参数,用于设置 JVM 的初始堆大小(Initial Heap Size)。这个参数对于优化 Java 应用程序的性能非常重要,特别是在处理需要大量内存的应用程序时。 …...
Idea 创建 Spring 项目(保姆级)
描述信息 最近卷起来,系统学习Spring;俗话说:万事开头难;创建一个Spring项目在网上找了好久没有找到好的方式;摸索了半天产出如下文档。 在 Idea 中新建项目 填写信息如下 生成项目目录结构 pom添加依赖 <depende…...
C++多线程学习(一):C++11 多线程快速入门
参考引用 C11 14 17 20 多线程从原理到线程池实战代码运行环境:Visual Studio 2019 1. 为什么要用多线程 任务分解 耗时的操作,任务分解,实时响应 数据分解 充分利用多核CPU处理数据 数据流分解 读写分离,解耦合设计 2. 第一个…...
Linux系统之lsof命令的基本使用
Linux系统之lsof命令的基本使用 一、lsof命令的基本使用二、lsof命令的使用帮助2.1 lsof命令的help帮助信息2.2 lsof命令帮助解释 三、lsof的基本使用3.1 直接使用lsof命令3.2 查看某个进程打开的所有文件3.3 查看某个用户打开的所有文件3.4 查看某个文件被哪些进程打开3.5 查看…...
性能压力测试的优势与重要性
性能压力测试是软件开发过程中至关重要的一环,它通过模拟系统在极限条件下的运行,以评估系统在正常和异常负载下的表现。这种测试为确保软件系统的可靠性、稳定性和可伸缩性提供了关键信息。下面将探讨性能压力测试的优势以及为什么在软件开发中它具有不…...
AtCoder Beginner Contest 329 题解A~F
A - Spread 输入字符串,字符之间加上空格输出 B - Next 输出数组当中第二大的数 C - Count xxx 统计每个字符出现过的最长长度,再累加即可 #include<bits/stdc.h> #pragma GCC optimize("Ofast") #define INF 0x3f3f3f3f #define I…...
C++实现分布式网络通信框架RPC(3)--rpc调用端
目录 一、前言 二、UserServiceRpc_Stub 三、 CallMethod方法的重写 头文件 实现 四、rpc调用端的调用 实现 五、 google::protobuf::RpcController *controller 头文件 实现 六、总结 一、前言 在前边的文章中,我们已经大致实现了rpc服务端的各项功能代…...
java_网络服务相关_gateway_nacos_feign区别联系
1. spring-cloud-starter-gateway 作用:作为微服务架构的网关,统一入口,处理所有外部请求。 核心能力: 路由转发(基于路径、服务名等)过滤器(鉴权、限流、日志、Header 处理)支持负…...
Python实现prophet 理论及参数优化
文章目录 Prophet理论及模型参数介绍Python代码完整实现prophet 添加外部数据进行模型优化 之前初步学习prophet的时候,写过一篇简单实现,后期随着对该模型的深入研究,本次记录涉及到prophet 的公式以及参数调优,从公式可以更直观…...
Java-41 深入浅出 Spring - 声明式事务的支持 事务配置 XML模式 XML+注解模式
点一下关注吧!!!非常感谢!!持续更新!!! 🚀 AI篇持续更新中!(长期更新) 目前2025年06月05日更新到: AI炼丹日志-28 - Aud…...
OpenPrompt 和直接对提示词的嵌入向量进行训练有什么区别
OpenPrompt 和直接对提示词的嵌入向量进行训练有什么区别 直接训练提示词嵌入向量的核心区别 您提到的代码: prompt_embedding = initial_embedding.clone().requires_grad_(True) optimizer = torch.optim.Adam([prompt_embedding...
Swagger和OpenApi的前世今生
Swagger与OpenAPI的关系演进是API标准化进程中的重要篇章,二者共同塑造了现代RESTful API的开发范式。 本期就扒一扒其技术演进的关键节点与核心逻辑: 🔄 一、起源与初创期:Swagger的诞生(2010-2014) 核心…...
是否存在路径(FIFOBB算法)
题目描述 一个具有 n 个顶点e条边的无向图,该图顶点的编号依次为0到n-1且不存在顶点与自身相连的边。请使用FIFOBB算法编写程序,确定是否存在从顶点 source到顶点 destination的路径。 输入 第一行两个整数,分别表示n 和 e 的值(1…...
在web-view 加载的本地及远程HTML中调用uniapp的API及网页和vue页面是如何通讯的?
uni-app 中 Web-view 与 Vue 页面的通讯机制详解 一、Web-view 简介 Web-view 是 uni-app 提供的一个重要组件,用于在原生应用中加载 HTML 页面: 支持加载本地 HTML 文件支持加载远程 HTML 页面实现 Web 与原生的双向通讯可用于嵌入第三方网页或 H5 应…...
网站指纹识别
网站指纹识别 网站的最基本组成:服务器(操作系统)、中间件(web容器)、脚本语言、数据厍 为什么要了解这些?举个例子:发现了一个文件读取漏洞,我们需要读/etc/passwd,如…...
并发编程 - go版
1.并发编程基础概念 进程和线程 A. 进程是程序在操作系统中的一次执行过程,系统进行资源分配和调度的一个独立单位。B. 线程是进程的一个执行实体,是CPU调度和分派的基本单位,它是比进程更小的能独立运行的基本单位。C.一个进程可以创建和撤销多个线程;同一个进程中…...
