0Pricing
Sveltejs Academy · 课时

使用 +server.js 从服务器流式传输

使用 ReadableStream 从 API 路由逐步发出数据块

使用 +server.js 从服务器流式传输 是 CoddyKit 上的免费 Sveltejs Academy 课时。 这是第 3 节课,共 4 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 Sveltejs Academy 学习路径的一部分,你的进度在网页和 CoddyKit 应用中同步。 Sveltejs Academy 课程共包含 4 节课。

服务器发送的流

在 +server.js 中,返回一个包装 ReadableStream 的 Response。

基本流

构建一个随时间发出数据块的流。

export function GET() {
  const stream = new ReadableStream({
    async start(controller) {
      for (const chunk of source) {
        controller.enqueue(new TextEncoder().encode(chunk));
      }
      controller.close();
    }
  });
  return new Response(stream);
}

内容类型

设置适当的内容类型:text/plain、text/event-stream、application/json(NDJSON)等。

使用场景

AI 文本生成、实时日志、大型文件下载、渐进式数据更新。

背压

当使用方速度较慢时,流会限制生产速度,从而防止内存膨胀。

客户端使用

在客户端使用 response.body.getReader() 读取流。

服务器发送事件

如果需要从服务器向客户端单向推送,SSE 非常合适。将事件编码为 text/event-stream。

WebSockets 替代方案

如果需要双向通信,请通过单独的服务器或支持 WebSockets 的适配器来选择 WebSockets。

取消

在 start 函数中处理流的取消,以释放资源。

适配器支持

大多数适配器都支持流式传输;请查看适配器文档,了解边缘情况。

性能

流式传输可以缩短 TTFB,让客户端更早处理部分数据。

快速检查

在 +server.js 中使用哪种流类?

回顾

在 +server.js 中使用 ReadableStream,以实现分块且低延迟的服务器响应。

常见问题解答

「使用 +server.js 从服务器流式传输」课时是免费的吗?

是的 — 「使用 +server.js 从服务器流式传输」的完整文本可在网页上免费阅读。要进行交互式练习(内置代码编辑器和全天候 AI 导师)并解锁 Sveltejs Academy 课程的其余内容,请升级到 CoddyKit PRO。 Sveltejs Academy 课程共包含 4 节课。

「使用 +server.js 从服务器流式传输」这节课中我会学到什么?

使用 ReadableStream 从 API 路由逐步发出数据块 你通过在浏览器中直接运行的动手代码来练习 Sveltejs Academy,全天候 AI 导师会在你学习这节课的过程中回答你的问题。

学习 Sveltejs Academy 需要有经验吗?

无需任何先前经验。CoddyKit 上的 Sveltejs Academy 课程适合初学者到高级学习者,你可以从这里开始或从头开始,按照自己的节奏学习。 这是第 3 节课,共 4 节。

「使用 +server.js 从服务器流式传输」课时需要多长时间?

大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动,所以你能稳步进步,并在网页和应用中从离开的地方继续。

我能在这节 Sveltejs Academy 课中编写并运行代码吗?

能。每节 Sveltejs Academy 课都包含内置代码编辑器,你可以在浏览器中直接编写并运行真实代码,并获得即时 AI 反馈 — 无需本地设置。

此课程中的所有课时

  1. 在 load 中使用 Promise 流式传输数据
  2. 延迟加载与类似 Suspense 的用户体验
  3. 使用 +server.js 从服务器流式传输
  4. 渐进式水合
← 返回 Sveltejs Academy