登录页面的密码加密保护

package.json

@@ -51,7 +51,7 @@
     "html2canvas": "^1.4.1",
     "js-beautify": "1.13.0",
     "js-cookie": "3.0.1",
-    "jsencrypt": "3.2.1",
+    "jsencrypt": "^3.2.1",
     "lib-flexible": "^0.3.2",
     "nprogress": "0.2.0",
     "quill": "1.3.7",

src/api/encrypt.js

@@ -0,0 +1,8 @@
+import { JSEncrypt } from 'jsencrypt'
+
+export function encryptedData(publicKey,password){
+  const encryptor = new JSEncrypt()
+  encryptor.setPublicKey(publicKey)
+  return encryptor.encrypt(password+'')
+}
+

src/api/login.js

@@ -1,5 +1,15 @@
 import request from '@/utils/request'
 
+// 获取密码加密传输公钥
+export function getSecretKey() {
+  return request({
+    url: '/auth/getSecretKey',
+    headers: {
+      isToken: false
+    },
+    method: 'post'
+  })
+}
 // 登录方法
 export function login(username, password, code, uuid) {
   return request({

src/views/system/login.vue

@@ -48,9 +48,12 @@
 	import StarBackground from '@/components/star'
 	import {
 		getCodeImg,
-    fontConfig
-	} from '@/api/login'
-	import Cookies from 'js-cookie'
+    fontConfig,getSecretKey
+  } from '@/api/login'
+  import {
+    encryptedData
+  }
+  import Cookies from 'js-cookie'
 	import {
 		encrypt,
 		decrypt
@@ -165,18 +168,22 @@
 							Cookies.remove('password')
 							Cookies.remove('rememberMe')
 						}
-						this.$store.dispatch('Login', this.loginForm).then(() => {
-							console.log('!@!@!@', this.redirect)
-							this.$router.push({
-								//path: this.redirect || '/'
-								path: '/'
-							}).catch(() => {})
-						}).catch(() => {
-							this.loading = false
-							if (this.captchaOnOff) {
-								this.getCode()
-							}
-						})
+            //登录前先获取密码加密传输的公钥，对密码进行加密
+            getSecretKey().then(res => {
+              const encryptedPassword = encryptedData(res.data,this.loginForm.password);
+              this.loginForm.password = encryptedPassword;
+              this.$store.dispatch('Login', this.loginForm).then(() => {
+                this.$router.push({
+                  //path: this.redirect || '/'
+                  path: '/'
+                })
+              }).catch(() => {
+                this.loading = false
+                if (this.captchaOnOff) {
+                  this.getCode()
+                }
+              })
+            })
 					}
 				})
 			}