Vercel 始终检测到我处于 Next.js 14（应用程序路由器）的生产环境中

Question

我正在使用 Next.js 14（应用程序路由器）构建一个应用程序，我需要知道我所处的环境，以便我可以在我的 Supabase Auth 组件中设置一个

redirectTo

链接。这是我第一次使用 Supabase Auth。在我尝试执行此操作之前，一切都按预期工作，但我不想进入我的存储库并根据我当前的环境手动更改

redirectTo

链接。我使用了 Supabase Auth 文档，并将代码复制并粘贴到我的项目中。代码如下：

const getURL = () => {
    let url =
      process?.env?.NEXT_PUBLIC_SITE_URL ?? // Set this to your site URL in production env.
      process?.env?.NEXT_PUBLIC_VERCEL_URL ?? // Automatically set by Vercel.
      'http://localhost:3000/';
    // Make sure to include `https://` when not localhost.
    url = url.includes('http') ? url : `https://${url}`;
    // Make sure to include a trailing `/`.
    url = url.charAt(url.length - 1) === '/' ? url : `${url}/`;
    return url;
  };

  const baseURL = getURL();
  console.log(baseURL)

NEXT_PUBLIC_VERCEL_URL

是 Vercel 自动生成的用于查看预览的 URL。我没有将其放入我的

.env

文件中，但我确实将其添加到了我在 Vercel 中的项目中。我不确定如何在我的

.env

文件中向该值添加通配符，但如果这在本地不起作用，那么它可能在任何其他环境中都不起作用。我的

.env

文件中的值是正确的，而且我还将环境变量直接添加到 Vercel 中的项目设置中。我确保选中了用于生产、预览和开发的相应框。

当我在本地运行项目和

console.log

baseURL

时，该值每次都是生产 URL。我的代码中是否遗漏了某些内容或做错了什么？

Answer 1

NEXT_PUBLIC_SITE_URL

和

NEXT_PUBLIC_VERCEL_URL

应该按顺序翻转吗？

let url =
      process?.env?.NEXT_PUBLIC_VERCEL_URL ?? // Set this to your site URL in production env.
      process?.env?.NEXT_PUBLIC_SITE_URL ?? // Automatically set by Vercel.
      'http://localhost:3000/';