在 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 加密,然后把加密后的密码传递给登录请求。