Next.js使用bcrypt哈希管理员密码时出现fs模块找不到错误

错误原因 #

bcrypt是依赖Node.js核心模块（如fs）的后端库，而Next.js页面组件默认在客户端浏览器环境运行，浏览器不支持Node.js的核心模块，因此导入后会触发"找不到fs"的错误。同时你原代码中bcrypt.genSalt和bcrypt.hash是异步方法，未加await会导致传入数据库的是Promise对象而非实际哈希值。

解决方案：将密码哈希逻辑移至API路由（推荐） #

密码哈希属于敏感操作，必须在服务器端执行，避免前端暴露明文密码或哈希逻辑。具体步骤如下：

1. 修改前端页面（adminlogin.js） #

移除bcrypt导入，直接将明文密码传给API路由：

import { useRouter } from 'next/router';

export default function AdminLogin() {
  const router = useRouter();

  const createAdminData = async (e) => {
    e.preventDefault(); // 阻止表单默认提交行为
    const usernameInfo = e.target.username.value;
    const passwordInfo = e.target.password.value;

    const res = await fetch("/api/database/addadmindata", {
      method: "POST",
      headers: {
        "Content-type": "application/json",
      },
      body: JSON.stringify({
        username: usernameInfo,
        password: passwordInfo, // 传递明文密码到服务器
      }),
    });
    const result = await res.json();
    router.reload();
  };

  return (
    <form onSubmit={createAdminData}>
      <input name="username" type="text" placeholder="用户名" />
      <input name="password" type="password" placeholder="密码" />
      <button type="submit">创建管理员</button>
    </form>
  );
}

2. 在API路由中处理哈希逻辑（api/database/addadmindata.js） #

API路由运行在服务器端，可以正常使用bcrypt：

import bcrypt from 'bcrypt';
// 导入你的数据库操作工具（如mongoose、prisma等）

export default async function handler(req, res) {
  if (req.method !== 'POST') {
    return res.status(405).json({ message: '仅支持POST请求' });
  }

  const { username, password } = req.body;
  const saltRounds = 10;

  try {
    // 异步生成盐并哈希密码
    const salt = await bcrypt.genSalt(saltRounds);
    const hashedPassword = await bcrypt.hash(password, salt);

    // 执行数据库存入操作（示例）
    // await AdminModel.create({ username, password: hashedPassword });

    res.status(200).json({ message: '管理员创建成功' });
  } catch (error) {
    res.status(500).json({ message: '创建失败', error: error.message });
  }
}

额外注意事项 #

• 永远不要在前端处理密码哈希：即使通过HTTPS传输，服务器端哈希仍是更安全的做法，避免明文密码在前端暴露风险。
• 异步方法必须加await：bcrypt的genSalt和hash都是异步函数，不加await会得到Promise对象，无法生成正确的哈希值。

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