React如何导入md5,把密码password进行md5加密
在 React 项目里对密码进行 MD5 加密,你可以借助 crypto-js 库,它提供了 MD5 加密功能。以下是详细步骤:
1. 安装 crypto-js 库
在项目根目录下,通过以下命令来安装 crypto-js :
npm install crypto-js
2. 在 React 组件中导入并使用 MD5 加密
文件里,你可以按照下面的方式导入并使用 MD5 加密:
// ... existing code ...
import CryptoJS from 'crypto-js'; // 导入 crypto-js 库
export default function Login() {
// ... existing code ...
const onFinish = async (values) => {
console.log("用户名:", values.username);
// 对密码进行 MD5 加密
const encryptedPassword = CryptoJS.MD5(values.password).toString();
console.log("加密后的密码:", encryptedPassword);
console.log("验证码:", values.captcha);
console.log("所选角色:", values.selectedRole);
try {
// 发送登录请求,使用加密后的密码
const response = await post('/login/validate', {
account: values.username,
password: encryptedPassword, // 使用加密后的密码
captcha: values.captcha,
company_id: values.selectedRole,
captchaKey: captchaData.captchaKey,
});
console.log('登录响应:', response);
// 模拟登录成功后跳转到主页
navigate("/home");
} catch (error) {
console.error('登录失败:', error);
}
};
// ... existing code ...
}
加密密码 :在 onFinish 函数里,借助 CryptoJS.MD5(values.password).toString() 对密码进行 MD5 加密,然后把加密后的密码传递给登录请求。