From 53a4174aa989c95bf723b76ff80bba604f09b25d Mon Sep 17 00:00:00 2001 From: abearxiong Date: Tue, 14 Apr 2026 12:38:51 +0800 Subject: [PATCH] temp --- src/browser-entry.tsx | 2 +- src/pages/a/ClientApp.tsx | 17 +++++++++++++++++ src/pages/a/main.tsx | 18 +++--------------- src/server-node.tsx | 20 ++++++++++++++------ 4 files changed, 35 insertions(+), 22 deletions(-) create mode 100644 src/pages/a/ClientApp.tsx diff --git a/src/browser-entry.tsx b/src/browser-entry.tsx index 0655bcf..e35e95d 100644 --- a/src/browser-entry.tsx +++ b/src/browser-entry.tsx @@ -1,5 +1,5 @@ import { hydrateRoot } from 'react-dom/client'; -import App from './pages/a/main'; +import App from './pages/a/ClientApp'; // import AServer from './pages/a/server/index.tsx'; declare global { diff --git a/src/pages/a/ClientApp.tsx b/src/pages/a/ClientApp.tsx new file mode 100644 index 0000000..3f56067 --- /dev/null +++ b/src/pages/a/ClientApp.tsx @@ -0,0 +1,17 @@ +'use client'; +import List from './List.tsx'; + +// Client Component - 用于 hydration,结构需要和 ServerApp 一致 +declare global { + interface Window { + __SERVER_DATA__?: { version: string }; + } +} + +export default function ClientApp() { + const version = typeof window !== 'undefined' && window.__SERVER_DATA__?.version + ? window.__SERVER_DATA__.version + : 'loading'; + + return ; +} \ No newline at end of file diff --git a/src/pages/a/main.tsx b/src/pages/a/main.tsx index a797c15..5490c67 100644 --- a/src/pages/a/main.tsx +++ b/src/pages/a/main.tsx @@ -1,18 +1,6 @@ import List from './List.tsx'; -// 模拟异步获取数据 -async function fetchData() { - await new Promise(resolve => setTimeout(resolve, 1000)); - return { version: '2.0.0', timestamp: Date.now() }; -} - -// Server Component - 直接 await 获取数据 -export default async function ServerApp() { - const data = await fetchData(); - return ( -
-

Server Time: {new Date(data.timestamp).toLocaleTimeString()}

- -
- ); +// Server Component - 通过 props 接收数据,不再自己 fetch +export default async function ServerApp({ version }: { version: string }) { + return ; } \ No newline at end of file diff --git a/src/server-node.tsx b/src/server-node.tsx index 467c48a..22e3a8a 100644 --- a/src/server-node.tsx +++ b/src/server-node.tsx @@ -19,7 +19,13 @@ const mimeTypes: Record = { '.ico': 'image/x-icon', }; -async function ssrRender(res: http.ServerResponse, version: string) { +// 模拟异步获取数据 +async function fetchServerData() { + await new Promise(resolve => setTimeout(resolve, 1000)); + return { version: '2.0.0', timestamp: Date.now() }; +} + +async function ssrRender(res: http.ServerResponse, routeVersion?: string) { let template: string; try { template = fs.readFileSync(indexHtmlPath, 'utf-8'); @@ -29,10 +35,12 @@ async function ssrRender(res: http.ServerResponse, version: string) { return; } - const serverData = { version }; - try { - const stream = await renderToReadableStream(
, { + // 服务端获取数据 + const data = await fetchServerData(); + const serverData = { version: data.version, timestamp: data.timestamp }; + + const stream = await renderToReadableStream(
, { bootstrapScripts: [] }); @@ -59,7 +67,7 @@ http.createServer((req, res) => { const urlPath = req.url?.split('?')[0] || '/'; if (urlPath === '/') { - ssrRender(res, ''); + ssrRender(res); return; } @@ -80,7 +88,7 @@ http.createServer((req, res) => { } catch { } - ssrRender(res, ''); + ssrRender(res); }).listen(PORT, () => { console.log(`Server running on http://localhost:${PORT}`); }); \ No newline at end of file