问题标签 [nextjs-dynamic-routing]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
graphql - 即使手动一切正常，getStaticProps 也不返回数据
我目前正在创建一个博客 Web 应用程序，并希望显示当前类别中的所有帖子，当前目录为 [slug].js/category。但是，即使一切似乎都运行良好，getStaticProps 也没有返回任何数据。getStaticProps 和 getStaticPaths 如下所示：
如上面的代码所示，params.slug 返回预期的 slug。但是，将其作为参数传递给 getSimilarPosts 不会产生所需的数据，这很奇怪。
查询类别中相似帖子（getSimilarPosts）的功能是：
API 函数工作正常，因为手动查询它（slug：“webdev”）返回预期的数据对象。getStaticProps 似乎有问题。
next.js - 基于推荐人的条件重定向
是否可以根据访问者的推荐人有条件地重定向？
我想要做的是重定向来自特定域（和/或任何其他子域）的用户，如果没有引荐来源或域不匹配，则不应应用重定向。
我在考虑使用 getServerSideProps()。
dynamic - NextJS 嵌套路由的不同布局
我的项目中有不同的嵌套路由，例如：
- / （这意味着如果它不是像 / (index) 或 /about 这样的嵌套路由）
- 博客
- 轮廓
所有这些路线都需要不同的布局（导航栏/侧边栏，也许还有头部和身体）但我不知道实现这一点的最佳实践是什么。所有这些路由都包含动态和静态路由。
next.js - NextJs 动态文件夹路由
我试图实现一个你有两个单独的导航栏的情况，带有链接“结果”、“统计”的视图导航和带有链接“学校-a”、“学校-b”、“学校-c”的学校-导航.. . 当用户第一次登陆时，url 看起来像这样：
设想：
- 点击 .views-nav 链接[statistics] => https://example.com/statistics/school-a
- 然后点击 .schools-nav 链接[school-c] => https://example.com/statistics/school-c
- 然后点击 .views-nav 链接[results] => https://example.com/results/school-c
- 然后点击 .schools-nav 链接[school-b] => https://example.com/results/school-b
- 然后点击 .views-nav 链接 [statistics] => https://example.com/statistics/school-b
尝试手动访问https://example.com/statistics/或https://example.com/results/应该重定向到 404。
预期行为：点击 navbar[views] 链接在结果和统计数据之间切换，同时保持学校 slug，点击 navbar[schools] 链接在学校之间切换，同时保持视图 slug。
当前文件夹结构是
现在我的猜测是用 useRouter 做点什么，但我不知道该怎么做。有人可以指出我正确的方向吗？
reactjs - NextJS - Vercel 上的增量静态再生不断超时（在专业计划中 - 60 秒超时限制）
我在 Vercel 专业计划上托管的 NextJS 项目遇到问题。使用 ISR 设置的路由只会超时。我revalidate目前已设置为 120 秒，但我也尝试过 60 秒、30 秒和 6000 秒，以防我过于频繁地调用它。
我使用 Strapi 作为无头 CMS，为 NextJS 提供 API 以构建页面并部署在 Render 的德国区域。Strapi 使用的数据库是托管在 MongoDB Atlas 上并部署在 MongoDB 的爱尔兰 AWS 区域上的 mongodb 数据库。（我还将 Vercel 上的无服务器功能设置为从英国伦敦提供服务，但我不确定这是否会影响 ISR？）
有 3 个不同的动态路由，每个路由大约 20 个页面，在构建时它们平均分别为 6999 毫秒、6508 毫秒和 6174 毫秒。然而在运行时，如果我更新 Strapi CMS 中的一些内容并等待我为revalidate页面设置的 120 秒，则几乎不会重建。如果我查看显示实时日志的 vercel 仪表板“功能”选项卡，我会发现许多页面都试图同时重建所有页面，并且它们都达到了 60 秒的超时限制。
我也将vercel日志发送到LogTail，如果我为我编辑的页面名称过滤日志，我可以看到它在120秒之前返回一个304状态代码，但在120秒之后它会尝试获取并构建新页面，几乎总是返回超时错误。
所以我的第一个问题是，如果所有这些页面的 CMS 中没有任何变化，但我故意改变了自己，为什么还有这么多人试图同时重建？其次，为什么在构建时构建页面平均只需要 6000 毫秒，但在 ISR 期间却达到了 60 秒的超时限制？
可能是因为触发了如此多的重建，以至于它们最终都导致彼此超时？如果是这样，那么我该如何解决第一个问题？
这是我的 vercel 实时日志的屏幕截图。如您所见，许多页面都试图立即重建，但我不知道为什么，在这种情况下我只更改了一页的数据。
为了尝试调试问题，我决定创建一个 Postman Flow 来构建动态路由之一，然后将构建页面所需的每个 api 调用的时间加起来，经过几次测试后，我平均得到 7621 毫秒。这是 Postman 控制台的屏幕截图：
我对 NextJs ISR 没有那么丰富的经验，所以我希望我只是做错了什么，或者我在 vercel 等上没有正确设置。但是在查看了 stackoverflow 和其他网站之后，我相信我正在使用 ISR正如预期的那样。如果有人对可能发生的事情有任何想法或建议，我将非常感激。
firebase - nextJS api 路由不适用于 Firebase 托管
在将我的网站部署到 Firebase 托管时，我遇到了使用 nextJS api 路由的问题。这是api调用：
这是 pages 目录中的设置：
这是 email.js 中使用的函数：
我更改了变量以不泄露我的电子邮件地址。
当我使用本地主机时调用有效。但是，当我构建并部署到 Firebase 时。我曾尝试使用 firebase url 进行 api 调用，但找不到 404 页面。我不知道如何解决这个问题。我真的很感激任何帮助。
next.js - NextJS 静态页面永远不会在浏览器中刷新，尽管在服务器上重新验证
我有一个 NextJS 项目，其中包含许多getStaticProps()与revalidate. 正如预期的那样，页面是在构建时生成的，并在指定的时间间隔内重新构建（使用 REST 客户端进行验证）。但是，用户永远无法看到页面的刷新版本，因为浏览器似乎缓存了生成的 html。在生产环境中，NextJS 服务器生成缓存头如下：Cache-Control: s-maxage=60, stale-while-revalidate. 无论我等待或浏览页面多长时间，浏览器都不会请求更新的页面。我只有在手动刷新页面时才能看到新数据——我不能要求我的用户每天都这样做。我还尝试使用位于 NextJS 服务器前面的 nginx覆盖Cache-Control标头，但没有机会。max-age=60, s-maxage=60, stale-while-revalidate=120对于我使用的页面上的链接import Link from "next/link". 对此有什么想法吗？
reactjs - NextJS 在使用内部化和动态路由时出现“href-interpolation-failed”和 404 错误
我有一个动态路由 (/blog/[id]) 和两种语言 (tr -> default, en)。如果我去 domain/blog/id 或 domain/tr/blog/id 一切正常，但 domain/en/blog/id 给出 404 页面。此外，如果我去 domain/blog/id 并将其更改为 domain/en/blog/id 并 router.push(pathname, pathname, { locale: val.target.value })给出 href Interpolation Failed 错误消息
注意：编辑器中的错误不相关（对象可能是'未定义'.ts（2532））。
next.js - NextJS：无法使用动态路由设置标题
我无法在使用动态路由创建的页面上设置标题和其他元标记。当页面在浏览器中加载时，标题和元数据设置正确，但它们没有在我使用 wget 获取的原始 HTML 代码中设置。
我已经尝试使用两者<Head>并<NextSeo>获得相同的结果。我也尝试了这两种getStaticProps() / getStaticPaths()方法getServerSideProps()。
这是我的代码的简化片段。
reactjs - 页面刷新时 getServerSideProps 上的 context 参数为空
在我的一个项目中，我需要通过从 REST API 请求中获取的数据来填充meta 关键字和meta 描述。
所以我使用该getServerSideProps函数来获取响应并将其传递给页面。
这是我的 getServerSideProps 函数
在开发模式（本地主机）下一切正常，但部署后，通过刷新页面Context 参数是一个空对象。
这个函数是写在有一个参数叫做城市的页面之一中，如下图所示
我已经检查了getServerSideProps 道具空对象。正如安克里所说
您能否检查一下，您是否将 pageProps 传递给您的自定义组件？
这是我的Component标签，其中包含 pageProps。