NextJS 13 + MongoDB部署Vercel后数据无法实时更新，本地正常

1. 修复API路由缓存问题 #

Vercel部署的Next.js App Router API路由默认会缓存GET请求响应，即便前端请求设置了cache: 'no-store'，后端响应仍可能被Vercel边缘网络缓存。需在API路由中显式禁用缓存：

修改route.js：

import { NextResponse } from 'next/server';
import connectMongoDB from '../../../../utils/db';
import PachetAnimatori from '../../../../models/pachetAnimatori';

// 强制API路由动态处理，禁用缓存
export const dynamic = 'force-dynamic';

export const GET = async () => {
  try {
    await connectMongoDB(); // 等待数据库连接完成再执行查询
    const pacheteAnimatori = await PachetAnimatori.find();
    // 响应头添加缓存禁用规则
    return new NextResponse(JSON.stringify(pacheteAnimatori), {
      headers: {
        'Cache-Control': 'no-store, no-cache, must-revalidate, proxy-revalidate',
        'Pragma': 'no-cache',
        'Expires': '0',
      },
    });
  } catch (err) {
    return new NextResponse('Error when getting pacheteAnimatori', { status: 500 });
  }
};

2. 修复Mongoose连接异步问题 #

原db.js未处理连接的异步逻辑，可能导致查询在连接完成前执行。修改db.js：

import mongoose from 'mongoose';

const connectMongoDB = async () => {
  // 已连接则直接返回，避免重复连接
  if (mongoose.connection.readyState === 1) return;
  try {
    await mongoose.connect(process.env.MONGO);
    console.log('connected to MONGODB');
  } catch (err) {
    console.log('err:', err);
    throw err; // 抛出错误让API路由捕获处理
  }
};

export default connectMongoDB;

3. 避免Mongoose模型重复注册 #

Vercel无服务器环境下，每次请求可能重新初始化模块，导致模型重复注册（间接引发数据异常）。修改你的pachetAnimatori模型文件：

import mongoose from 'mongoose';

const pachetAnimatoriSchema = new mongoose.Schema({
  // 你的模型字段定义
});

// 检查模型是否已存在，避免重复注册
export default mongoose.models.PachetAnimatori || mongoose.model('PachetAnimatori', pachetAnimatoriSchema);

4. 强化前端请求缓存禁用配置 #

虽然已设置cache: 'no-store'，可额外添加请求头确保浏览器不缓存：

const getPacheteAnimatori = async () => {
  try {
    const res = await fetch(`${process.env.NEXT_PUBLIC_URL_API}/animatori`, {
      cache: 'no-store',
      headers: {
        'Cache-Control': 'no-store',
      },
    });

    if (!res.ok) {
      throw new Error('PacheteAnimatori failed to fetch');
    }

    return res.json();
  } catch (err) {
    console.log('error loading pacheteAnimatori', err);
  }
};

额外检查项 #

• 确认Vercel项目设置中的MONGO环境变量与本地配置一致；
• 检查MongoDB网络白名单，确保Vercel服务器能访问数据库实例（如MongoDB Atlas可临时添加0.0.0.0/0测试）。

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