Tiptap 编辑
构建一个通用的编辑工作流:读取文档、生成编辑操作,并将其应用到服务器上。
查看 GitHub 上的源代码。
当 AI 需要重写现有内容时使用该工作流
Tiptap 编辑工作流是最灵活的 Server AI Toolkit 工作流。可用于诸如 重写段落、在目标节点附近插入新块,或转换整份文档等任务。
在读取与执行中复用同一个 session
读取步骤会返回一个 sessionId。在执行请求中发送相同的 sessionId,以便当文档在 AI 读取之后发生变化时,服务器能够拒绝过期的编辑。
开始之前,请先按照 授权指南 完成身份验证设置。
1. 从 AI Server 读取文档
读取你希望模型处理的文档部分。调用:
POST /v3/ai/toolkit/read/read-document
import { getAuthHeaders } from '@/lib/server-ai-toolkit/get-auth-headers'
const readResponse = await fetch(`${apiBaseUrl}/toolkit/read/read-document`, {
method: 'POST',
headers: getAuthHeaders(),
body: JSON.stringify({
schemaAwarenessData,
sessionId,
format: 'shorthand',
reviewOptions: {
mode: 'disabled',
},
experimental_documentOptions: {
documentId,
userId: 'ai-assistant',
},
}),
})
const readResult = await readResponse.json()2. 生成编辑操作
从 AI Server 获取工作流定义,并让模型生成结构化的编辑操作。
const workflowResponse = await fetch(`${apiBaseUrl}/toolkit/workflows/edit`, {
method: 'POST',
headers: getAuthHeaders(),
body: JSON.stringify({
format: 'shorthand',
}),
})
const workflow = await workflowResponse.json()
const schemaResponse = await fetch(`${apiBaseUrl}/toolkit/schema-awareness-prompt`, {
method: 'POST',
headers: getAuthHeaders(),
body: JSON.stringify({
schemaAwarenessData,
}),
})
const { prompt: schemaAwarenessPrompt } = await schemaResponse.json()
const result = streamText({
model,
system: `${workflow.systemPrompt}\n\n${schemaAwarenessPrompt}`,
prompt: JSON.stringify({
content: readResult.output.content,
task,
}),
output: Output.object({ schema: z.fromJSONSchema(workflow.outputSchema) }),
})
const output = await result.output3. 执行编辑工作流
将生成的操作发送回 Server AI Toolkit。当你使用的是 Tiptap Cloud 文档时,服务器会自动更新协作文档。调用:
POST /v3/ai/toolkit/execute-workflow/tiptap-edit
const executeResponse = await fetch(`${apiBaseUrl}/toolkit/execute-workflow/tiptap-edit`, {
method: 'POST',
headers: getAuthHeaders(),
body: JSON.stringify({
schemaAwarenessData,
format: 'shorthand',
input: output,
sessionId: readResult.sessionId,
reviewOptions: {
mode: 'disabled',
},
experimental_documentOptions: {
documentId,
userId: 'ai-assistant',
},
}),
})
const executeResult = await executeResponse.json()4. 从编辑器 UI 触发工作流
客户端应保存最新的 sessionId,并在下一次请求中一并发送。
const response = await fetch('/api/server-edit-workflow', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
documentId,
schemaAwarenessData: getSchemaAwarenessData(editor),
task,
sessionId,
}),
})
const result: { sessionId: string } = await response.json()
setSessionId(result.sessionId)跟踪更改(Tracked changes)
将此工作流与 Tracked Changes 扩展集成,以便在 AI 编辑文档后显示审阅界面,并允许用户接受和拒绝更改。
在向 POST /v3/ai/toolkit/execute-workflow/tiptap-edit 发起的请求中,配置 reviewOptions 参数:
reviewOptions: {
mode: 'trackedChanges',
trackedChangesOptions: {
userId: 'ai-assistant',
},
}查看 AI Toolkit 演示,了解如何将 Server AI Toolkit 工作流与 Tracked Changes 集成的示例。
最终效果
完成的演示会在服务器端将协作文档进行整体重写:
查看 GitHub 上的源代码。