简介
导出为 PDF 需要配置 JSON Web Token (JWT) 身份验证以维护文件安全性。JWT 端点生成并提供授权令牌,用于验证提交的内容由授权用户发送,防止未授权访问。作为标准的 Web 服务授权解决方案,JWT 的文档详见 https://jwt.io/。
本指南提供将导出为 PDF 与 TinyMCE 集成(包括导出为 PDF 功能)的全面演练,使用 Node.js 服务器生成 JWT 令牌。内容涵盖项目设置、服务器配置和 TinyMCE 自定义。
您将构建的内容
在深入技术细节之前,通过本指南您将实现:
一个运行导出为 PDF 插件的可工作的 TinyMCE 编辑器
使用 JWT 令牌的安全身份验证系统
一个简单的 Node.js 服务器来处理身份验证
本指南专为新接触 JWT 身份验证和 TinyMCE 集成的开发者设计。
前提条件
开始前,请确保您已具备:
计算机上已安装 Node.js(检查方法:在终端中运行
node -v)一个 TinyMCE API 密钥(从 TinyMCE 网站获取)
基本命令行操作知识
开始前请确保已准备好 API 密钥,服务器和客户端配置都需要用到。
本指南使用
exportpdf_converter_options的嵌套格式(version: '2')。需要 TinyMCE 8.4.0 或更高版本。完整的选项文档请参阅 导出为 PDF。旧版本的集成者请参阅 导出为 PDF 的 JWT 身份验证设置(Node.js)– 平面格式。
快速入门指南
项目设置
# 创建并进入项目目录 mkdir tinymce-my-app cd tinymce-my-app # 初始化项目 npm init -y # 安装所需包 npm install express cors jsonwebtoken
验证 package.json 文件现在是否包含所需的依赖项。
创建项目结构
# 创建用于存放 Web 文件的 public 文件夹 mkdir public touch public/index.html touch jwt.js
您的项目应如下所示:
/tinymce-my-app
/public
index.html (TinyMCE 网页)
jwt.js (服务器代码)
package.json (项目配置)配置
生成公钥/私钥对
设置 JWT 身份验证
为 TinyMCE 导出为 PDF 设置 JSON Web Token (JWT) 身份验证:
添加公钥到您的 Tiny 账户,登录。
通过 Tiny 账户 - JWT 密钥设置 JSON Web Token (JWT) 提供者端点
配置您的 TinyMCE 使用 JWT 端点。
导出为 PDF 服务器需要从 JSON Web Token (JWT) 提供者端点所使用的 私钥 生成的 公钥。存储在导出为 PDF 服务器上的公钥用于确保内容由授权用户发送。
在账户门户的 JWT 密钥部分有两种生成和添加公钥的方法:
在 Tiny 账户 - JWT 密钥生成新的密钥对(推荐)。
本地生成密钥对并在 Tiny 账户 - JWT 密钥导入公钥。
使用 Tiny 账户 JWT 密钥页面生成密钥对
Tiny 账户 - JWT 密钥页面提供“生成新的密钥对”选项,提供一种快速且安全的方法来生成所需的密钥。这将存储一份 公钥 的副本,并提供一个可下载的文件用于公钥和私钥。Tiny 不存储 私钥,且该密钥对无法在之后检索。
本地生成密钥对并添加到账户
此方法涉及两个步骤:在本地生成密钥对,然后将公钥添加到账户门户。
本地生成密钥对
在本地生成密钥对时,请使用支持的算法之一。导出为 PDF 不支持对称加密算法,例如 HS256。Tiny 推荐使用 RS256 算法。支持的算法如下:
RS256
RS384
RS512
PS256
PS384
PS512
有关这些算法的详细信息,请访问:RFC 7518,JSON Web 算法(JWA)第 3 节 - 用于数字签名和 MAC 的加密算法。
有关在本地生成密钥对的说明,请参阅:为 Tiny Cloud 创建私钥/公钥对。
在账户门户的 JWT 密钥部分添加公钥
在本地生成公钥后,使用账户门户 JWT 密钥部分的“导入公钥”选项:Tiny 账户 - JWT 密钥。
设置 JSON Web Token (JWT) 端点
JSON Web Token(JWT)端点是用于生成并向用户提供授权令牌的服务。这些令牌可用于验证提交的内容是由经过授权的用户发送,并防止未经授权的访问。
下图展示了 JWT 的使用方式:
当用户打开 Export to PDF 时:
Export to PDF 代表用户请求一个签名的 JWT。
如果您的 JWT 端点授权该用户,您的 JWT 端点将向 Export to PDF 发送一个 JWT,以认证该用户。
当用户发起请求(如导出文档)时,JWT 将随请求一起发送,以表明该用户已获得授权。此 JWT 使用存储在 Export to PDF 服务器上的 公钥 进行验证。
Export to PDF 服务器发送响应,指示内容提交成功(或必要时提示未授权)。
JWT 端点要求
Export to PDF 的 JSON Web Token(JWT)端点需要满足以下条件:
端点或服务器接受 JSON HTTP POST 请求。
用户认证 - 验证用户身份以及他们应具有 Export to PDF 访问权限的方法。
JWT 使用与提供给 Tiny Account - JWT Keys 的 公钥 配对的 私钥 生成(签名)。
端点或服务器生成包含令牌的 JSON 响应。Export to PDF 将使用该令牌向 Export to PDF 服务器提交请求。
Export to PDF 所需的 JWT 声明
JWT 端点生成的 JSON Web Token 必须包含以下声明:
aud (必需)类型: String
aud 是区分大小写的字符串,必须匹配启用了 Export to PDF 插件的有效 API 密钥。
iat (必需)类型: Number
iat 表示签发时间戳,以秒数指定。例如,要将签发时间设置为当前时间戳,请将签发时间计算为当前时间戳除以 1000。
iat: Math.floor(Date.now() / 1000), // 签发时间戳
exp (必需)类型: Number
exp 表示过期时间戳,以秒数指定。例如,要设置 10 分钟的有效期,请将过期时间计算为当前时间戳加上 600 秒。
exp: Math.floor(Date.now() / 1000) + (60 * 10) // 过期时间(10 分钟)
服务器设置(jwt.js)
在根目录中,将服务器设置代码复制并粘贴到 jwt.js 文件中。
const express = require('express'); // 设置 Web 服务器。const jwt = require('jsonwebtoken'); // 生成并签名 JWT。const cors = require('cors'); // 允许跨域请求。const path = require('path'); // 处理文件路径。const app = express();app.use(cors());// 您的私钥(请用实际密钥替换此内容)const privateKey = `-----BEGIN PRIVATE KEY-----{您的 PKCS8 私钥放在这里}-----END PRIVATE KEY-----`;app.use(express.static(path.join(__dirname, 'public')));// JWT 令牌生成端点app.post('/jwt', (req, res) => { const payload = { aud: 'no-api-key', // 用您的实际 API 密钥替换 iat: Math.floor(Date.now() / 1000), // 签发时间戳 exp: Math.floor(Date.now() / 1000) + (60 * 10) // 过期时间(10 分钟) }; try { // 令牌使用您的私钥通过 RS256 算法签名 const token = jwt.sign(payload, privateKey, { algorithm: 'RS256' }); res.json({ token }); } catch (error) { res.status(500).send('生成 JWT 令牌失败。'); console.error(error.message); }});const PORT = 3000;app.listen(PORT, () => { console.log(`服务器运行于 http://localhost:${PORT}`);});网页(public/index.html)
在您创建 index.html 文件的 public 文件夹中添加 HTML 设置代码。
<!DOCTYPE html>
<html>
<head>
<title>带有 Export to PDF 的 TinyMCE</title>
<script
src="https://cdn.tiny.cloud/1/no-api-key/tinymce/8/tinymce.min.js"
referrerpolicy="origin"
crossorigin="anonymous">
</script>
<script>
tinymce.init({
selector: 'textarea',
plugins: 'exportpdf',
toolbar: 'exportpdf',
exportpdf_converter_options: {
version: '2',
document: {
size: 'Letter',
margins: {
top: '1in',
right: '1in',
bottom: '1in',
left: '1in'
}
}
},
// exportpdf_token_provider 从 `/jwt` 端点获取令牌。
exportpdf_token_provider: () => {
return fetch('http://localhost:3000/jwt', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
}).then(response => response.json());
},
});
</script>
</head>
<body>
<h1>TinyMCE Export to PDF 演示</h1>
<textarea>
欢迎使用 TinyMCE!试试 Export to PDF 功能。
</textarea>
</body>
</html>配置步骤
添加您的 API 密钥
将两个文件中的
no-api-key替换为您的实际 TinyMCE API 密钥HTML 脚本源和 JWT 负载中的 API 密钥应相同
添加您的私钥
将
jwt.js中的私钥占位符替换为您的实际私钥确保它是
PKCS8格式安全保存此密钥,切勿公开分享
运行您的项目
启动服务器:
node jwt.js
在浏览器中打开:
http://localhost:3000您应该能看到:
TinyMCE 编辑器
工具栏中的“导出为 PDF”按钮
进一步配置
有关每页页眉和页脚、PDF 元数据和安全设置等其他选项,请参阅 Export to PDF 插件页面上的 exportpdf_converter_options 部分。