Next.js配置重定向时URL查询参数未显示的解决方法

问题原因 #

Next.js的redirects配置默认开启passQuery: true，该规则会优先传递源路径的查询参数到目标路径。当源路径无查询参数时，会忽略目标路径中手动指定的查询参数，导致参数丢失。

修复方案 #

在重定向规则中添加passQuery: false，明确告知Next.js不传递源路径的查询参数，直接使用目标路径的完整参数配置：

async redirects() {
    return [
      {
        source: '/test',
        destination: '/testing-page?redirect=true',
        permanent: true,
        passQuery: false // 新增配置项
      },
    ]
}

额外注意事项 #

• 修改next.config.js后必须重启开发服务器，新配置才能生效
• 如果需要同时保留源路径的查询参数并新增固定参数，可使用:query占位符实现：

  async redirects() {
      return [
        {
          source: '/test',
          destination: '/testing-page?redirect=true&:query',
          permanent: true,
        },
      ]
  }
  

内容的提问来源于stack exchange，提问作者sov