uni-app项目实现用户注册密码前端页面加密

uni-app项目下引入crypto-js.js实现密码加密

一、HBuilder 安装 crypto-js.js

视图==>显示终端==> cd 进入项目根目录 例如：demo\test_vue 一般打开终端默认是项目根目录

输入npm install crypto-js安装crypto-js.js

安装完成后检查项目根目录是否出现node_modules文件夹

在utils文件夹下新建crypto.js，根据自己项目决定在什么文件夹下

crypto.js

//引入下载好的js文件
import CryptoJS from '../node_modules/crypto-js/crypto-js.js'
// 加密
const keyStr = 'test' // 解密用的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>
	import { encrypt } from '../../utils/crypto.js'

	export default {
		data() {
			return {
				name: '', // 账号
				password: '', // 密码

			};
		},

	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>