uni-app项目使用crypto.js实现注册用户密码加密
一、HBuilder 安装 crypto-js.js
视图==>显示终端==> cd 进入项目根目录, 例如:demo\test_vue 一般打开终端默认是项目根目录
输入
npm install crypto-js安装
安装完成查看项目根目录
view页面
<uni-easyinput prefixIcon="phone" v-model="form.name" :inputBorder="false"placeholderStyle="font-size:30rpx" type="text" placeholder="用户名"></uni-easyinput>
<uni-easyinput prefixIcon="locked" v-model="form.password" :inputBorder="false"placeholderStyle="font-size:30rpx" type="password" placeholder="登录密码"></uni-easyinput>
二、在utils文件夹下新建crypto.js
import CryptoJS from '../node_modules/crypto-js/crypto-js.js'
// 加密
const keyStr = 'demo' // 解密用的key
export function encrypt (word) {
const time = Date.now()
const key = CryptoJS.enc.Utf8.parse(keyStr)
const srcs = CryptoJS.enc.Utf8.parse(time + word) // 加密方式: 时间戳 + 密文
const encrypted = CryptoJS.AES.encrypt(srcs, key, {mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7})
return encrypted.toString()
}
<script>
//引入定义好的js
import { encrypt } from '../../utils/crypto.js'
export default {
data() {
return {
name: '', // 账号
password: '', // 密码
};
},
register(){
uni.request({
url: "xxxx",//请求接口
method: 'get',
dataType: 'json',
data: {
userName: this.name,
//具体用法:调用import 的js方法实现加密
passWord: encrypt(this.password),
},
success: (res) => {
//注册成功吃操作
})
}
},
/**
* 去登陆
*/
toLogin: function() {
uni.navigateTo({
url: "/pages/login/login"
});
},
/**
* 回到首页
*/
toIndex: function() {
uni.switchTab({
url: '/pages/index/index'
});
}
}
}
}
<script>