Next.js部署Vercel后调用数据库遇InvalidDatasourceError及405问题求助

1. 解决 Prisma InvalidDatasourceError 错误 #

原因 #

生产构建时用了 --data-proxy 参数生成客户端，但数据库URL还是 mysql:// 协议——启用 Data Proxy/Accelerate 必须用 prisma:// 开头的专用URL。

解决步骤 #

• 获取 Prisma Data Proxy URL：登录 Prisma Dashboard，找到对应项目，复制 prisma:// 开头的数据库链接（不是原始的mysql地址）。
• 配置 Vercel 环境变量：在 Vercel 项目的环境变量面板添加 DATABASE_URL，值为刚才复制的 prisma:// URL，确保生产环境读取这个变量。
• 更新 Prisma 客户端初始化代码：因为用了 --data-proxy，生产环境的客户端需要启用 Data Proxy 支持，修改 /lib/prisma.ts：

  import { PrismaClient } from '@prisma/client';
  
  let prisma: PrismaClient;
  
  declare global {
    var prisma: PrismaClient;
  }
  
  if (process.env.NODE_ENV === 'production') {
    // 生产环境启用 Data Proxy
    prisma = new PrismaClient({
      datasourceUrl: process.env.DATABASE_URL,
    });
  } else {
    if (!global.prisma) {
      global.prisma = new PrismaClient();
    }
    prisma = global.prisma;
  }
  
  export default prisma;
  

• 确认 schema 配置：你的 /prisma/schema.prisma 中 datasource 的 url 已经指向 env("DATABASE_URL")，无需修改。

2. 解决 GraphQL 405 方法不允许错误 #

原因 #

客户端请求的是 /api/graphql，但 Yoga 服务器配置的 graphqlEndpoint 依赖 process.env.GRAPHQL_API 变量，如果这个变量未在 Vercel 正确设置（或路径不匹配），就会导致路由不匹配，返回405。

解决步骤 #

• 统一端点路径：把 /api/graphql.ts 中的 graphqlEndpoint 直接设为固定路径，和客户端保持一致：

  export default createYoga<{
    req: NextApiRequest;
    res: NextApiResponse;
  }>({
    schema,
    graphqlEndpoint: '/api/graphql', // 替换为固定路径，避免环境变量缺失问题
  });
  

• 验证路由配置：你现有代码中 export const config 的 bodyParser: false 是 Yoga 必需的，无需修改。
• 确认客户端路径：/lib/apollo.ts 中的 uri: '/api/graphql' 已经和服务器端点一致，无需修改。

额外检查 #

• 确保 Vercel 上的所有环境变量（尤其是 DATABASE_URL）都已正确配置，且生产构建时能被读取。
• 修改完成后重新部署 Vercel 项目，确保所有变更生效。

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