Next.js 如何基于正则规则与Cookie条件实现路径重定向

错误原因 #

Next.js的redirects配置的source字段有专属路径匹配规则，不支持直接传入完整正则表达式的锚点^/$格式，你原来的正则写法不符合匹配要求。

修正后的配置 #

async redirects() {
    return [
      {
        // 匹配所有路径中不包含关键词bar的请求
        source: '/:path((?!bar).)*',
        has: [{
          type: 'cookie',
          key: 'utm_source',
          value: 'bar',
        }],
        destination: '/foo/bar',
        // 调试阶段建议设为false，避免浏览器缓存301重定向导致规则更新不生效
        permanent: false
      }
    ]
  }

注意事项 #

• 修改next.config.js后必须重启Next.js服务，配置才会生效
• 上述规则会匹配所有层级的路径，只要路径任意位置不包含bar、且存在utm_source=bar的Cookie就会触发重定向
• 如果不需要校验Cookie的值，只要存在utm_sourceCookie就触发重定向，删除has配置中的value字段即可

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