ReboFiles文档
开始3
什么是 ReboFiles
快速开始
可运行的演示
集成到你的应用6
React 组件
Headless:你自己的界面
不使用框架
样式与主题
键盘与无障碍
语言
文件9
上传
预览与查看器
搜索
实时更改与大文件夹
评论
星标与字段
版本、回收站与空间
打包下载 .zip
Word 文档
服务器14
路由
框架与登录
谁可以做什么
存储:S3、GCS、Azure 与磁盘
检查上传
元数据:SQLite 与 Postgres
数据库结构
共享与链接
动态与通知
钩子、日志与限制
保留、法律保留与导出
桌面端与其他来源
同步文件夹
上线生产环境
协作1
AI 助手(MCP)
参考5
包
组件与 hooks
客户端 API
HTTP 路由
状态与路线图
↑↓ 移动↵ 打开Esc 关闭38 个页面

文件 Word 文档

Word 文档

Rebodocs 是可选的对等依赖:安装 @rebodocs/core 和 @rebodocs/viewer 后,.docx 会由它的引擎读取,并在 Rebodocs 的查看器中显示。没有它时,网盘会像对待其他文件一样显示 .docx。
开始

接入 Rebodocs

import { FileDrive } from '@rebofiles/react';
import { pictureOfDocx, previewDocx, textOfDocx, thumbDocx, viewDocx } from '@rebofiles/react/rebodocs'; // needs @rebodocs/core and @rebodocs/viewer

<FileDrive
  base="/api/files"
  previewDocument={previewDocx}   // the details: its first paragraphs
  viewDocument={viewDocx}         // the viewer: its pages, with Rebodocs' zoom
  thumbDocument={thumbDocx}       // the grid, until a picture of it is made
  pictureDocument={pictureOfDocx} // that picture, of its first page, made at upload
  textDocument={textOfDocx}       // what is written in it, to find it by
  onOpenDocument={(file, url) => router.push(`/documents/${file.id}`)}
/>
编辑器

打开并保存回网盘

“在 Rebodocs 中打开”会调用 onOpenDocument,并传入读取文件的地址;保存回网盘就是上传一个新版本。

import { DocsEditor } from '@rebodocs/react';
import { useActions } from '@rebofiles/react';

const { upload } = useActions();
<DocsEditor docx={bytes} onSave={(docx) => upload(new File([docx], file.name), { file: file.id })} />

playground 中的 apps/playground/src/Editor.tsx 就是这样做的:⌘S 保存,网盘会把该文档显示为它的下一个版本。

新建

创建文档

import { newDocx } from '@rebofiles/react/rebodocs';

// "New document" in the Upload menu: an empty .docx,
// named by the person, in the folder they are in, and opened with onOpenDocument.
<FileDrive base="/api/files" newDocument={newDocx} viewDocument={viewDocx} onOpenDocument={open} />

newDocument 用于生成空文档:Rebodocs 的 newDocx,或你自己的模板。没有 onOpenDocument 时,新文档在查看器中打开。

PDF

导出为 PDF

Word 文档的查看器在“打印”旁有 PDF 按钮:由 Rebodocs 在页面中根据显示的页面生成并下载(viewDocx 返回对象的 pdf())。编辑器也可以用 editor.exportPdf() 生成。

协作

多人同时编辑

借助 Rebodocs 的协作服务器,网盘中的每个文档都是一个房间:打开它的人可以与其他人同时编写,各自有自己的光标;只能读取的人只能观看。

import { createCollabServer } from '@rebodocs/collab/server';

// A room for each document of the drive, named by its id: opened from the file,
// kept as a new version of it once everybody has left (apps/documents/server/collab.ts).
const collab = createCollabServer({ storage: roomsOverTheDrive });
app.use('/collab', collab.handle);

<DocsEditor collab={{ url: location.origin, room: file.id, ticket }} onSave={saveAsVersion} />

文档演示(npm run documents,apps/documents)完整实现了这一点:基于网盘的房间、根据每个人对文件的权限签发的票据,以及所有人离开后保存的新版本。

历史

比较两个版本

Word 文档在某个版本与当前版本之间的变化,显示在页面上:红色删除线表示删除的内容,绿色下划线表示添加的内容,可逐个查看。

import { compareDocx } from '@rebofiles/react/rebodocs';

// "Compare" on each version of a Word document but the current, in its history.
<FileDrive base="/api/files" viewDocument={viewDocx} compareDocument={compareDocx} />
MCP

供助手使用

在 @rebofiles/mcp 旁边安装 Rebodocs 后,Claude 可以用 Rebodocs 自带的工具阅读和编辑网盘中的 Word 文档,每次修改都保存为一个版本:AI 助手。