Next.js部署Vercel Hobby计划遇Serverless函数超时，求最优解

问题背景 #

在Next.js项目中使用getServerSideProps获取URL参数，本地功能正常，但部署到Vercel免费版（Hobby计划）时出现以下超时错误：

This Serverless Function has timed out.
Your connection is working correctly.
Vercel is working correctly.
504: GATEWAY_TIMEOUT Code: FUNCTION_INVOCATION_TIMEOUT ID: gru1::5g5x4-1687230420091-471e7398e9e4
If you are a visitor, contact the website owner or try again later.
If you are the owner, learn how to fix the error and check the logs.

测试Vercel Pro计划时，通过配置vercel.json调整函数内存和超时时间解决了问题，配置如下：

{
   "framework": "nextjs",
   "functions": {
     "src/pages/[nickName]": {
       "memory": 3008,
       "maxDuration": 20
     }
   }
}

最优解决方案选择 #

1. 免费版可行的成本优化方案 #

如果不想升级付费计划，优先通过以下方式压缩getServerSideProps的执行时间：

• 精简服务端逻辑：检查getServerSideProps内是否有冗余的API请求、重复的数据计算，合并相同请求、移除不必要的处理步骤；非敏感数据的处理可转移到客户端执行。
• 优化外部API调用：若函数内调用了外部接口，添加超时控制（比如用Promise.race搭配定时器），避免外部接口超时拖垮服务端函数；对允许缓存的外部数据，添加本地缓存逻辑减少重复请求。
• 配置免费版函数上限：Vercel免费版允许函数内存最高1024MB、超时最长10秒，可通过vercel.json配置到最大值，示例：

{
  "framework": "nextjs",
  "functions": {
    "src/pages/[nickName].js": {
      "memory": 1024,
      "maxDuration": 10
    }
  }
}

2. 付费升级方案（当优化后仍不满足需求） #

若业务逻辑确实需要更长的执行时间或更高的内存，升级到Vercel Pro计划是直接有效的方案：

• Pro计划支持函数内存最高3008MB、超时最长20秒，可通过你测试的vercel.json配置生效，适合服务端必须处理复杂计算、多接口聚合的场景。

3. 架构层面的替代方案（长期最优） #

如果业务场景允许，改用以下方案可彻底避免服务端函数超时问题：

• 增量静态生成（ISR）：若URL参数对应的页面数据不需要实时更新，用getStaticProps结合fallback: true或fallback: 'blocking'实现静态页面生成，仅在数据更新时重新生成页面，无需每次请求执行服务端函数。
• 客户端获取参数：若获取URL参数后无需处理敏感数据，直接在客户端用useRouter()的query对象获取参数，完全跳过服务端函数执行，从根源消除超时风险。

总结 #

优先通过精简服务端逻辑、优化外部调用将执行时间压缩到免费版的10秒限制内；若无法满足，再考虑升级Pro计划；最后根据业务场景评估是否改用静态生成或客户端获取参数的架构方案。

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