Next.js对接MongoDB接口时req.query参数未正常传递问题

参数无法被接口获取的核心原因是前端发起GET请求时，没有把userName参数拼接在URL查询串中，接口侧的req.query自然读不到对应值。另外现有代码还有三处可优化的问题：

• 给GET请求设置Content-Type: application/json请求头是无效操作，GET请求没有请求体，该头不会产生实际作用
• 单值匹配查询没必要使用$in操作符，直接匹配字段即可，查询性能更高
• 接口侧缺少参数空值校验，未传参时会触发无效的数据库查询

前端请求逻辑修改 #

将需要传递的userName参数编码后拼接到请求URL末尾，移除无效的请求头：

export async function getStaticProps() {
  // 替换为你实际需要查询的用户名变量
  const queryUserName = "实际要查询的用户名";
  const res = await fetch(`http://localhost:3000/api/usersAPI?userName=${encodeURIComponent(queryUserName)}`, {
    method: "GET"
  });
  let users = await res.json();

  return {
    props: { users },
  };
}

接口侧逻辑修改 #

增加参数空值校验，简化数据库查询语句：

case "GET": {
  const { userName } = req.query;
  // 参数缺失时直接返回客户端错误，避免无效查库
  if (!userName) {
    return res.status(400).json({ msg: "缺少必填查询参数userName" });
  }
  const users = await db
    .collection("USERS")
    .find({ user: userName })
    .toArray();
  res.json(users);
  break;
}

排查提示：如果修改后依然拿不到参数，检查项目内是否有中间件、反向代理规则过滤了URL上的查询参数，Next.js默认API路由会自动解析?key=val格式的查询参数到req.query对象，无需额外手动解析。

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