Hacktoberfest 2026:维护者为十月标记出来的 issue,仍然开放、适合新手。 浏览 Hacktoberfest issue

[2.0 rc.14 / next] A synchronous `prepareRequest` hook makes every hydrated server-function read refetch in the browser

已关闭
#3,959 0 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看

维护者通常 1 天内回复

还没有人认领这个 Issue。

评估

难度
3/5
预计耗时
半天
新手友好度
55/100
Issue 类型
缺陷
描述清晰度
描述清楚
活跃度
活跃
领域
frontend

调研方向

Start in packages/web/server-functions/src/client.ts, in createRequest, where config.prepareRequest is awaited even when it returns synchronously. Then read subFetch in packages/solid/src/client/hydration.ts to see how the fetch mock is swapped and restored. Done means a synchronous prepareRequest produces zero client requests after hydration for memo and store sources, and the existing client, server and hydration test suites still pass.

由索引模型根据 Issue 内容生成。

描述

Summary

With any prepareRequest configured, even an identity hook init => init, a page whose data comes from server functions fetches that data twice: once during SSR, and again from the browser right after hydration, although the serialized value was adopted. Without the hook there is no client request.

Reproduces on 2.0.0-rc.14 and on next at 358159c6.

Reproduction
// client entry, before render
import { configureServerFunctionsClient } from "@solidjs/web/server-functions/client";
configureServerFunctionsClient({ prepareRequest: init => init });
// a page reading a "use server" function through a memo or derived store
const value = createMemo(() => readThing());
return <p>{value()}</p>;

Load the page directly (SSR, then hydrate) and watch the network:

prepareRequest SSR reads Client requests after hydration
not configured 1 0
init => init 1 1

The DOM is adopted correctly in both cases; the extra request is wasted (and, for private reads, doubles server work on every page load).

Cause

Hydration runs a serialized source's compute once, synchronously, inside subFetch (packages/solid/src/client/hydration.ts), with window.fetch swapped for a never-settling mock, then restores it. The server-function transport's createRequest (packages/web/server-functions/src/client.ts) does:

if (config.prepareRequest) {
  const prepared = await config.prepareRequest(init, { id, meta });

The await runs even when the hook returns synchronously, so send(base, init) happens a microtask later, after subFetch has restored the real fetch. The call goes to the network instead of the mock.

Fix

Await only when the hook returns a promise:

-    const prepared = await config.prepareRequest(init, { id, meta });
+    let prepared = config.prepareRequest(init, { id, meta });
+    if (typeof (prepared as PromiseLike<RequestInit>)?.then === "function") prepared = await prepared;

A synchronous hook then sends inside the hydration window like the default transport. An async hook still awaits, so it keeps the current behaviour (an async hook will always miss the synchronous window; that may be worth documenting). With this change the table above shows 0 client requests for both rows, for memo and store sources, sync and async. @solidjs/web's client, server and hydration test suites pass unchanged. I can open a PR.

(submitted by Claude Opus 5.5 on behalf of rvlzzr)

主要语言
TypeScript
星标
36.1k
派生
1.1k
平均合并
11 小时 32 分钟
30 天内合并 PR
356

环境准备

从这里开始

  1. 先读完整个 Issue,再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库,在一个分支上完成修改。
  4. 提交 Pull Request,并在描述里引用这个 Issue 编号。

solidjs/solid 的其他 Issue

查看 solidjs/solid 的全部 Issue

相似的 Issue

更多 TypeScript Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。