user page ssr

deno-china · Mar 12, 2020 · 44c0b88 · 44c0b88
1 parent e92d228
commit 44c0b88
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 8 deletions.
diff --git a/src/common/global.ts b/src/common/global.ts
@@ -0,0 +1,5 @@
+const GlobalData = {
+  apiBase: ""
+};
+
+export default GlobalData;
diff --git a/src/entry/server.tsx b/src/entry/server.tsx
@@ -2,18 +2,25 @@ import React from "react";
 import { renderToString } from "react-dom/server";
 import { StaticRouter } from "react-router";
 import App from "../App";
+import GlobalData from "../common/global";
 import { findRoute, prefetch } from "../common/route-utli";
 
 globalThis.React = React;
 
 interface RenderProps {
   url?: string;
+  api_base: string;
+  data: Object;
 }
 
 export default async function render(props: RenderProps) {
-  const { url = "/" } = props;
+  console.log(props);
+  const { url = "/", api_base = "", data } = props;
+
+  GlobalData.apiBase = api_base;
+
   let routeInfo = findRoute(url);
-  let state = prefetch(routeInfo);
+  let state = { ...data, ...(await prefetch(routeInfo)) };
   const html = renderToString(
     <StaticRouter location={{ pathname: url }}>
       <App {...state} />

diff --git a/src/index.html b/src/index.html
@@ -9,9 +9,6 @@
   </head>
   <body>
     <div id="app">${content}</div>
-    <script>
-      // INJIECT:__INIT_STATE__
-    </script>
     <script async src="./index.tsx"></script>
   </body>
 </html>
diff --git a/src/pages/User/index.tsx b/src/pages/User/index.tsx
@@ -1,6 +1,7 @@
 import React from "react";
 import { match } from "react-router";
 import { BasePage } from "../../common/base-page";
+import GlobalData from "../../common/global";
 import BasePanel from "../../components/base-panel";
 import DefaultLayout from "../../components/layouts/DefaultLayout";
 import "./index.less";
@@ -10,9 +11,9 @@ const User: BasePage<{
 }> = {
   async prefetch(match: match<{ id: string }>) {
     const id = match.params.id;
-    const { data } = await fetch(`/api/user/info/${id}`).then(res =>
-      res.json()
-    );
+    const { data } = await fetch(
+      `${GlobalData.apiBase}/api/user/info/${id}`
+    ).then(res => res.json());
     return { user: data };
   },
   page(props) {