项目

tiptap 合作编辑与 JWT 认证

在我们的第一个教程中,我们从简单的文本框升级到了完整的协作编辑器。然而,由 Collaboration 提供的 JWT 有效期仅为几个小时,这对于测试足够,但显然不适合实际的在线应用。

什么是 JWT

简单来说,JWT(JSON Web Token)是一个通过密码学签名的 JSON 对象,这意味着生成的 JWT 不能被篡改。

如何生成 JWT

JWT 必须在服务器端生成,因为你的 secret 绝对不应离开服务器(即不要尝试在前端生成)。以下是 Node.js 服务器上使用的示例:

import jsonwebtoken from "jsonwebtoken";

const jwt = jsonwebtoken.sign(
  {
    /* 将要编码到JWT中的对象 */
  },
  "your_secret"
);
// 将这个JWT放在提供者的`token`字段中。绝不要将'your_secret'暴露给前端!

一个完整的服务器 /API 示例可以在 这里 找到。确保将 secret 放在服务器环境变量中(或者在服务器文件中将其设为常量,不要从客户端传递)。你可能需要创建一个像 GET /getCollabToken 这样的 API 调用,它会根据服务器秘钥和用户允许访问的文档列表生成 JWT。

如何限制对特定文档的访问

由于 Collaboration 无法提供文档列表,所以只能通过知道确切的文档名称来访问。因此,一个好的做法是使用类似 userUuid/documentUuid(例如 1500c624-8f9f-496a-b196-5e5dd8ec3c25/7865975c-38d0-4bb5-846b-df909cdc66d3 )的命名方式,这样猜测名称就无法打开随机文档。

如果你想进一步限制使用哪个 JWT 可以访问哪些文档,可以在 JWT 中添加 allowedDocumentNames 属性,如下所示。生成的 JWT 只允许访问指定的文档。

import jsonwebtoken from "jsonwebtoken";

const jwt = jsonwebtoken.sign(
  {
    allowedDocumentNames: [
      "1500c624-8f9f-496a-b196-5e5dd8ec3c25/7865975c-38d0-4bb5-846b-df909cdc66d3", // userUuid/documentUuid
      "1500c624-8f9f-496a-b196-5e5dd8ec3c25/*", // userUuid/*
    ],
  },
  "your_secret"
);
// 这个JWT应该放在提供者的`token`字段中。绝不要将'your_secret'暴露给前端!

请注意,实际部署时请确保妥善处理服务器秘钥的安全性和文档访问权限的控制。

在本文档中