App Router
Next.js 的 App Router 是一種利用 React 最新功能來建構應用程式的新典範。如果您已經熟悉 Next.js，您會發現 App Router 是現有基於檔案系統的路由器（Pages Router）的自然演進。
對於新應用程式，我們推薦使用 App Router。對於現有應用程式，您可以逐步採用 App Router。也可以在同一個應用程式中同時使用兩種路由器。
常見問題
如何在佈局中存取請求物件？
設計上您無法存取原始請求物件。但您可以透過僅限伺服器的函式存取 headers 和 cookies。您也可以設定 cookies。
佈局 (Layouts) 不會重新渲染。它們可以被快取並重複使用，以避免在頁面之間導航時進行不必要的計算。透過限制佈局存取原始請求，Next.js 可以避免在佈局中執行可能緩慢或昂貴的使用者程式碼，這可能會對效能產生負面影響。
這種設計還確保了佈局在不同頁面之間的行為一致且可預測，簡化了開發和除錯，因為開發人員可以依賴佈局的行為方式，而無需考慮它們應用到的特定頁面。
根據您正在建構的 UI 模式，平行路由 (Parallel Routes) 允許您在同一個佈局中渲染多個頁面，並且頁面可以存取路由區段以及 URL 搜尋參數。
如何在頁面上存取 URL？
預設情況下，頁面是伺服器元件 (Server Components)。您可以透過 params 屬性存取路由區段，並透過 searchParams 屬性存取 URL 搜尋參數。
如果您使用的是客戶端元件 (Client Components)，可以使用 usePathname、useSelectedLayoutSegment 和 useSelectedLayoutSegments 來處理更複雜的路由。
此外，根據您正在建構的 UI 模式，平行路由 (Parallel Routes) 允許您在同一個佈局中渲染多個頁面，並且頁面可以存取路由區段以及 URL 搜尋參數。
如何從伺服器元件重新導向？
您可以使用 redirect 從頁面重新導向到相對或絕對 URL。redirect 是臨時 (307) 重新導向，而 permanentRedirect 是永久 (308) 重新導向。當這些函式在串流 UI 時使用，它們會插入一個 meta 標籤以在客戶端觸發重新導向。
如何使用 App Router 處理身份驗證？
以下是一些支援 App Router 的常見身份驗證解決方案：
- NextAuth.js
- Clerk
- Auth0
- Stytch
- 或手動處理會話或 JWT
如何設定 cookies？
您可以在伺服器動作 (Server Actions) 或路由處理器 (Route Handlers) 中使用 cookies 函式來設定 cookies。
由於 HTTP 不允許在串流開始後設定 cookies，因此您無法直接從頁面或佈局設定 cookies。您也可以從中介軟體 (Middleware) 設定 cookies。
如何建構多租戶應用程式？
如果您想建構一個服務多個租戶的單一 Next.js 應用程式，我們已經建立了一個範例展示我們推薦的架構。
如何讓 App Router 的快取失效？
Next.js 中有多層快取，因此有多種方法可以讓快取的不同部分失效。了解更多關於快取的資訊。
是否有基於 App Router 的全面開源應用程式？
有的。您可以查看 Next.js Commerce 或 Platforms Starter Kit 這兩個較大的開源範例，它們都使用了 App Router。