使用 Server-Sent Events (SSE) 实现实时 AI 交互，以获得即时反馈和渐进式内容生成。

概述

TinyMCE AI 服务使用 Server-Sent Events (SSE) 提供实时流式响应。这使用户能够在 AI 生成内容的同时看到内容创建过程，提供即时反馈并实现交互式体验。

SSE 事件类型

Conversations、Reviews 和 Actions 在 SSE 流中使用不同的事件名称和 JSON 载荷。这些载荷记录在每个流式操作的 交互式 API 文档 中，而不是在功能概述页面（该页面仅总结使用了 SSE）。

请使用所调用操作的 API 参考文档—例如：

共享的线路格式和客户端解析在 SSE 线路格式以及本页面的基础实现部分有介绍。

SSE 线路格式

响应体是 Server-Sent Events 格式的文本流。事件以空行分隔。每个事件可以包含一个 event: 行（事件名称）和一个或多个 data: 行（载荷；长载荷可以拆分为多个 data: 行）。例如：

event: <event-name-1>
data: <data>

event: <event-name-2>
data: <data2>

正确解析此格式（包括块边界、多行 data: 字段和注释）在手动编写的循环中很容易出错。对于生产代码，请使用维护良好的 SSE 解析器，例如 eventsource-parser 包。

基础实现

从 fetch 获得流式 Response 后，将字节流通过 SSE 解析器传递。以下示例使用 eventsource-parser 将原始块转换为解析后的事件。对于每个事件，event.event 是来自 event: 行的事件名称，event.data 是来自 data: 行的 JSON 载荷：

import { createParser } from 'eventsource-parser';

const response = await fetch('/v1/your-endpoint', {
  method: 'POST',
  headers: {
    'Authorization': 'Bearer <token>',
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({
    // Request payload
  })
});

const parser = createParser({
  onEvent: (event) => {
    // event.event is the SSE event name
    // event.data is the reassembled data string for this event
    const payload = JSON.parse(event.data);

    switch (event.event) {
      case 'error':
        console.error('Error:', payload.message);
        break;
      default:
        // Handle all other events — event names vary by API; see
        // https://tinymceai.api.tiny.cloud/docs for each operation's schema.
        // Examples: Conversations (text-delta, source, reasoning, modification-delta),
        // Reviews (review-delta, review-metadata), Actions (modification-delta, action-metadata)
        console.log('Event:', event.event, payload);
    }
  }
});

const reader = response.body.getReader();
const decoder = new TextDecoder();

while (true) {
  const { done, value } = await reader.read();
  if (done) break;
  parser.feed(decoder.decode(value, { stream: true }));
}

错误处理

始终优雅地处理错误：

if (event.event === 'error') {
  const payload = JSON.parse(event.data);
  console.error('Streaming error:', payload.message);
}

进度跟踪

使用元数据事件来显示进度。审查流式响应的事件名称和字段定义在返回 SSE 响应的 Reviews API 操作中，而不是在 Review 插件概述中。

API 参考

交互式 API 文档 描述了每个功能领域的流式端点、事件形状和错误。

后续步骤