server-side rendering

Next.js或Gatsby？為什麼要選擇它們而不是create-react-app？而你又應該選擇哪一個呢？ create-react-app無法輕鬆地幫助您生成伺服器端渲染的應用程式。它所提供的一切（包括SEO、速度等等），只能由像Next.js和Gatsby這樣的工具提供。 Next.js比Gatsby更適合的時機是什麼？ 它們都可以幫助實現伺服器端渲染，但方式不同。 使用Gatsby的結果是一個靜態網站生成器，沒有伺服器。您可以構建網站，然後將構建過程的結果靜態地部署在Netlify或其他靜態主機網站上。 Next.js提供了一個後端，可以根據請求生成伺服器端渲染的響應，讓您可以創建動態網站，這意味著您將在可以執行Node.js的平台上部署它。 Next.js也可以生成靜態網站，但我不認為這是它的主要用例。 如果我的目標是構建一個靜態網站，我可能很難選擇，也許Gatsby擁有更好的插件生態系統，包括許多特定於博客的插件。 Gatsby還高度依賴於GraphQL，您可能會根據自己的觀點和需求喜歡或不喜歡這一點。

在 Next.js 中，在伺服器端渲染時存取 Cookie 可能比你想像中困難。以下是我解決這個問題的方法。 我遇到了這個問題。我的應用程式依賴於Cookie進行身份驗證，在使用 Next.js 時，顯然我的 Cookie 在首頁初始化時未被設置。 以下是負責使用Axios對一個 GET 端點進行請求的程式碼： Bookings.getInitialProps = async ctx => { const response = await axios.get('http://localhost:3000/api/bookings/list') return { bookings: response.data } } 我在伺服器端的端點上有 Passport.js，但它無法在 SSR 頁面上對用戶進行身份驗證，因為它找不到任何 Cookie。 我必須將程式碼更改為以下形式，將 Cookie 添加到 headers 中： Bookings.getInitialProps = async ctx => { const response = await axios({ method: 'get', url: 'http://localhost:3000/api/bookings/list', headers: ctx.req ? { cookie: ctx.req.headers.cookie } : undefined }) return { bookings: response.data } } 讓 Cookie 在後端中可用的關鍵是添加：...