前端Vue2引入jsrsasign进行RSA加密，登录Action增加RSA密码加密

ZR.Vue/package.json

@@ -34,6 +34,7 @@
     "js-beautify": "1.10.2",
     "js-cookie": "2.2.0",
     "jsencrypt": "3.0.0-rc.1",
+    "jsrsasign": "^10.8.6",
     "less-loader": "^6.0.0",
     "mavon-editor": "^2.9.1",
     "normalize.css": "7.0.0",

ZR.Vue/src/api/system/login.js

@@ -6,7 +6,7 @@ export function login(username, password, code, uuid) {
     username,
     password,
     code,
-    uuid
+    uuid,
   }
   return request({
     url: '/login',
@@ -19,7 +19,7 @@ export function login(username, password, code, uuid) {
 export function getInfo() {
   return request({
     url: '/getInfo',
-    method: 'get'
+    method: 'get',
   })
 }
 
@@ -27,7 +27,7 @@ export function getInfo() {
 export function logout() {
   return request({
     url: '/LogOut',
-    method: 'POST'
+    method: 'POST',
   })
 }
 
@@ -35,18 +35,26 @@ export function logout() {
 export function getCodeImg() {
   return request({
     url: '/captchaImage',
-    method: 'get'
+    method: 'get',
   })
 }
 
 /**
  * 注册
- * @returns 
+ * @returns
  */
 export function register(data) {
   return request({
     url: '/register',
     method: 'post',
-		data: data
+    data: data,
   })
-}
+}
+
+// 获取RSA公钥
+export function getRsaKey() {
+  return request({
+    url: '/getRsaKey',
+    method: 'get',
+  })
+}

ZR.Vue/src/store/modules/user.js

@@ -1,6 +1,6 @@
-import { login, logout, getInfo } from '@/api/system/login'
+import { login, logout, getInfo, getRsaKey } from '@/api/system/login'
 import { getToken, setToken, removeToken } from '@/utils/auth'
-
+import { encryptByPublicKey } from '@/api/utils/jsencrypt'
 const user = {
   state: {
     userInfo: '',
@@ -8,7 +8,7 @@ const user = {
     name: '',
     avatar: '',
     roles: [],
-    permissions: []
+    permissions: [],
   },
 
   mutations: {
@@ -29,29 +29,34 @@ const user = {
     },
     SET_USERINFO: (state, value) => {
       state.userInfo = value
-    }
+    },
   },
 
   actions: {
     // 登录
     Login({ commit }, userInfo) {
-      const username = userInfo.username.trim()
-      const password = userInfo.password
-      const code = userInfo.code
-      const uuid = userInfo.uuid
       return new Promise((resolve, reject) => {
-        login(username, password, code, uuid).then(res => {
+        getRsaKey().then((response) => {
-          if (res.code == 200) {
+          const publicKey = response.data.publicKey
-            setToken(res.data)
+          const username = userInfo.username.trim()
-            //提交上面的mutaions方法
+          const password = encryptByPublicKey(userInfo.password, publicKey)
-            commit('SET_TOKEN', res.data)
+          const code = userInfo.code
-            resolve() //then处理
+          const uuid = userInfo.uuid
-          } else {
+          login(username, password, code, uuid)
-            console.log('login error ' + res);
+            .then((res) => {
-            reject(res) //catch处理
+              if (res.code == 200) {
-          }
+                setToken(res.data)
-        }).catch(err => {
+                //提交上面的mutaions方法
-          reject(err);
+                commit('SET_TOKEN', res.data)
+                resolve() //then处理
+              } else {
+                console.log('login error ' + res)
+                reject(res) //catch处理
+              }
+            })
+            .catch((err) => {
+              reject(err)
+            })
         })
       })
     },
@@ -59,24 +64,27 @@ const user = {
     // 获取用户信息
     GetInfo({ commit, state }) {
       return new Promise((resolve, reject) => {
-        getInfo().then(res => {
+        getInfo()
-          const data = res.data
+          .then((res) => {
-          const avatar = data.user.avatar == "" ? require("@/assets/image/profile.jpg") : data.user.avatar;
+            const data = res.data
+            const avatar = data.user.avatar == '' ? require('@/assets/image/profile.jpg') : data.user.avatar
 
-          if (data.roles && data.roles.length > 0) { // 验证返回的roles是否是一个非空数组
+            if (data.roles && data.roles.length > 0) {
-            commit('SET_ROLES', data.roles)
+              // 验证返回的roles是否是一个非空数组
-            commit('SET_PERMISSIONS', data.permissions)
+              commit('SET_ROLES', data.roles)
-          } else {
+              commit('SET_PERMISSIONS', data.permissions)
-            commit('SET_ROLES', ['ROLE_DEFAULT'])
+            } else {
-          }
+              commit('SET_ROLES', ['ROLE_DEFAULT'])
+            }
 
-          commit('SET_NAME', data.user.nickName)
+            commit('SET_NAME', data.user.nickName)
-          commit('SET_AVATAR', avatar)
+            commit('SET_AVATAR', avatar)
-          commit('SET_USERINFO', data.user) //新加
+            commit('SET_USERINFO', data.user) //新加
-          resolve(res)
+            resolve(res)
-        }).catch(error => {
+          })
-          reject(error)
+          .catch((error) => {
-        })
+            reject(error)
+          })
       })
     },
 
@@ -84,27 +92,29 @@ const user = {
     LogOut({ commit, state }) {
       console.log('退出登录')
       return new Promise((resolve, reject) => {
-        logout().then((res) => {
+        logout()
-          removeToken() // 必须先移除token
+          .then((res) => {
-          commit('SET_TOKEN', '')
+            removeToken() // 必须先移除token
-          commit('SET_ROLES', [])
+            commit('SET_TOKEN', '')
-          commit('SET_PERMISSIONS', [])
+            commit('SET_ROLES', [])
-          resolve(res)
+            commit('SET_PERMISSIONS', [])
-        }).catch(error => {
+            resolve(res)
-          reject(error)
+          })
-        })
+          .catch((error) => {
+            reject(error)
+          })
       })
     },
 
     // 前端 登出
     FedLogOut({ commit }) {
-      return new Promise(resolve => {
+      return new Promise((resolve) => {
         commit('SET_TOKEN', '')
         removeToken()
         resolve()
       })
-    }
+    },
-  }
+  },
 }
 
-export default user
+export default user

ZR.Vue/src/utils/jsencrypt.js

@@ -1,5 +1,5 @@
 import JSEncrypt from 'jsencrypt/bin/jsencrypt.min'
-
+import jsrsasign from 'jsrsasign'
 // 密钥对生成 http://web.chacuo.net/netrsakeypair
 
 const publicKey = 'MFwwDQYJKoZIhvcNAQEBBQADSwAwSAJBALj0zjON+EVdBsnMcR4Uj+jOYgp5ZipftQZ1utW8KvVioz+RSaotF1JHt59q9SC/mZcWWpbpcEqQ3WyyyCC33msCAwEAAQ=='
@@ -21,3 +21,7 @@ export function decrypt(txt) {
   return encryptor.decrypt(txt) // 对数据进行解密
 }
 
+export const encryptByPublicKey = (txt, publicKey) => {
+  const pubKey = jsrsasign.KEYUTIL.getKey(publicKey)
+  return jsrsasign.KJUR.crypto.Cipher.encrypt(txt, pubKey)
+}