如何将nextjs应用置于维护模式下（使用Vercel）？

Question

我刚刚发布了我的 nextjs 应用到生产中，使用 Vercel.

我很喜欢整个体验，除了一个小小的部分。我很想能把我的应用放在... 维护模式但Vercel上似乎没有这个选项。

我的问题是： 有没有人曾经实现过这个功能，可以在这里分享一些细节？

我猜测它可以在两个层面上实现。

• 修改我的应用程序，如果检测到一个环境变量（即 MAINTENANCE_MODE=true)被检测到，每个页面都会重定向到一个维护界面。然而，这并不理想，因为在Vercel上添加一个环境变量需要一个部署才能考虑到它。
• 在Vercel上有一个简单的每个项目的开关来启用和禁用维护模式。这将会是一个巨大的惊喜。

Answer 1

"维护模式 "可以通过 重定向 财产 vercel.json.

{
  "redirects": [
    { "source": "/((?!maintenance).*)", "destination": "/maintenance.html", "permanent": false }
  ]
}

这就增加了一个与传入请求相匹配的通配符路由，然后发出一个临时重定向的 /maintenance.html 的位置。

在最新的Next.js Canary中，你可以在不需要用到 vercel.json 而改用 next.config.js. 试试 npm install -g next@canary 并创造 next.config.js:

module.exports = {
  experimental: {
    redirects() {
      return [
        process.env.MAINTENANCE_MODE === "1"
          ? { source: "/((?!maintenance).*)", destination: "/maintenance.html", permanent: false }
          : null,
      ].filter(Boolean);
    },
  },
};

请注意，你 不能 在不重新部署的情况下，对部署进行更改（配置或环境变量）。