Skip to main content

App Router

通过创建您的第一个页面开始使用 APP Router

常见问题

如何在一个页面中使用 request 对象?

您不打算使用原生 reqeust 对象. 不过, 您能够通过 server-only 功能使用 headerscookies. 您也能够 设置 cookies.

Layouts 不渲染. 它们可能被缓存和重复使用以避免在切换页面时进行不必要的计算. 通过限制布局获取原生请求 ,Next.js 能够预防在布局中执行可能耗时或代价高的、对性能产生消极作用的用户代码。

该设计也为跨页面布局强制了一致的和可预见的行为,从而简化了开发和调试。

取决于您构建的 UI 模式,平行 Routes允许您在同一个布局中渲染多个页面,并且页面中可以使用路由段和 URL 中的参数。

如何在页面中使用 URL?

默认情况下,页面是服务器组件。您可以在页面中通过params prop 和searchParams prop 使用路由段。

如果您正在使用客户端组件,您可以通过usePathname, useSelectedLayoutSegment, 和 useSelectedLayoutSegments使用更复杂的路由

此外,根据您正在构建的 UI 规则, 平行路由允许您在相同的布局中渲染多个页面,并且页面可以使用路由段和 URL 搜索参数

如何从服务器组件重定向?

您能够使用 redirect 从一个页面重定向到一个相对或绝对的 URL。 redirect 是暂时的 (307) 重定向, 然而 permanentRedirect 是永久的 (308) 重定向. 当这些功能在流式 UI 中使用时, 它们会插入一个 meta tag 去触发客户端的重定向 。

如何处理 APP Router 的身份认证?

以下是一些支持 APP Router 的常见身份认证解决方式:

如何设置 cookies?

您可以在Server ActionsRoute Handlers 中使用 cookies 功能设置 cookies.

由于 HTTP 不允许在流开始后设置 cookies,您不能直接在页面或布局中直接设置 cookies。您也可以在Middleware设置 cookies。

如何使 App Router 缓存无效?

Next.js 中有多层缓存, 因此,有多种方式使缓存的不同部分无效 。关于缓存了解更多

有使用 APP Router 的综合的、开源的应用程序吗?

是的。 您可以查看开源的使用 APP Router 的两个大型例子: Next.js CommercePlatforms Starter Kit

了解更多