feat: 密码用MD5加密

package-lock.json

@@ -10,6 +10,7 @@
       "hasInstallScript": true,
       "dependencies": {
         "axios": "^1.3.6",
+        "crypto-js": "^4.2.0",
         "gsap": "^3.13.0",
         "markdown-it": "^14.1.0",
         "normalize.css": "^8.0.1",
@@ -22,6 +23,7 @@
       },
       "devDependencies": {
         "@rushstack/eslint-patch": "^1.2.0",
+        "@types/crypto-js": "^4.2.2",
         "@types/node": "^18.16.0",
         "@vant/auto-import-resolver": "^1.3.0",
         "@vitejs/plugin-vue": "^4.0.0",
@@ -654,6 +656,13 @@
         "node": ">=10.13.0"
       }
     },
+    "node_modules/@types/crypto-js": {
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/@types/crypto-js/-/crypto-js-4.2.2.tgz",
+      "integrity": "sha512-sDOLlVbHhXpAUAL0YHDUUwDZf3iN4Bwi4W6a0W0b+QcAezUbRtH4FVb+9J4h+XFPW7l/gQ9F8qC7P+Ec4k8QVQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@types/estree": {
       "version": "1.0.1",
       "resolved": "https://registry.npmmirror.com/@types/estree/-/estree-1.0.1.tgz",
@@ -2104,6 +2113,12 @@
         "node": ">= 8"
       }
     },
+    "node_modules/crypto-js": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-4.2.0.tgz",
+      "integrity": "sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q==",
+      "license": "MIT"
+    },
     "node_modules/css-select": {
       "version": "4.3.0",
       "resolved": "https://registry.npmmirror.com/css-select/-/css-select-4.3.0.tgz",
@@ -8935,6 +8950,12 @@
       "integrity": "sha512-L7z9BgrNEcYyUYtF+HaEfiS5ebkh9jXqbszz7pC0hRBPaatV0XjSD3+eHrpqFemQfgwiFF0QPIarnIihIDn7OA==",
       "dev": true
     },
+    "@types/crypto-js": {
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/@types/crypto-js/-/crypto-js-4.2.2.tgz",
+      "integrity": "sha512-sDOLlVbHhXpAUAL0YHDUUwDZf3iN4Bwi4W6a0W0b+QcAezUbRtH4FVb+9J4h+XFPW7l/gQ9F8qC7P+Ec4k8QVQ==",
+      "dev": true
+    },
     "@types/estree": {
       "version": "1.0.1",
       "resolved": "https://registry.npmmirror.com/@types/estree/-/estree-1.0.1.tgz",
@@ -10039,6 +10060,11 @@
         "which": "^2.0.1"
       }
     },
+    "crypto-js": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-4.2.0.tgz",
+      "integrity": "sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q=="
+    },
     "css-select": {
       "version": "4.3.0",
       "resolved": "https://registry.npmmirror.com/css-select/-/css-select-4.3.0.tgz",

package.json

@@ -14,6 +14,7 @@
   },
   "dependencies": {
     "axios": "^1.3.6",
+    "crypto-js": "^4.2.0",
     "gsap": "^3.13.0",
     "markdown-it": "^14.1.0",
     "normalize.css": "^8.0.1",
@@ -26,6 +27,7 @@
   },
   "devDependencies": {
     "@rushstack/eslint-patch": "^1.2.0",
+    "@types/crypto-js": "^4.2.2",
     "@types/node": "^18.16.0",
     "@vant/auto-import-resolver": "^1.3.0",
     "@vitejs/plugin-vue": "^4.0.0",

src/utils/tools.ts

@@ -1,3 +1,5 @@
+import CryptoJS from 'crypto-js'
+
 function getUniversalZoomLevel() {
 	// 现代浏览器方案
 	if (window.visualViewport) {
@@ -146,3 +148,12 @@ export async function DownloadImages(list: Array<{ url: string, name?: string }>
 	}
 	typeof onSuccess === "function" && onSuccess(successCount, errCount);
 }
+
+/**
+ * MD5加密密码
+ * @param password 原始密码
+ * @returns MD5加密后的密码
+ */
+export function encryptPassword(password: string): string {
+	return CryptoJS.MD5(password).toString()
+}

src/views/login/LoginPage.vue

@@ -50,6 +50,7 @@ import { useUserInfoStore } from '@/stores'
 import { showToast } from 'vant'
 import { google } from '@/assets/base64'
 import { fetchRegisterOrLogin } from '@/api/login'
+import { encryptPassword } from '@/utils/tools'
 
 const router = useRouter()
 const userInfoStore = useUserInfoStore()
@@ -109,7 +110,8 @@ const handleLogin = async () => {
 
   isLoading.value = true
 
-  fetchRegisterOrLogin({ ...formData, operationType: 'LOGIN' }).then((response) => {
+  const encryptedPassword = encryptPassword(formData.password)
+  fetchRegisterOrLogin({ ...formData, password: encryptedPassword, operationType: 'LOGIN' }).then((response) => {
     console.log('登录成功', response)
     userInfoStore.setToken(response.token)
     userInfoStore.setUserInfo(response.user)

src/views/login/ResetPage.vue

@@ -43,6 +43,7 @@ import Verify from './components/Verify.vue'
 import Password from './components/Password.vue'
 import { showToast } from 'vant'
 import { precheckEmail, resetPassword } from '@/api/login'
+import { encryptPassword } from '@/utils/tools'
 
 const router = useRouter()
 const step = ref<'mail' | 'verify' | 'password'>('mail')
@@ -92,7 +93,7 @@ const handleCheckVerifyCode = (data: any) => {
 }
 
 const handleSuccess = (data: any) => {
-  fromData.value.password = data.password
+  fromData.value.password = encryptPassword(data.password)
   resetPassword(fromData.value).then((res) => {
     // console.log('res', res)
     showToast('the password has been reset')

src/views/login/SignupPage.vue

@@ -56,6 +56,7 @@ import { useRouter } from 'vue-router'
 import { showToast } from 'vant'
 import { google } from '@/assets/base64'
 import { fetchRegisterOrLogin } from '@/api/login'
+import { encryptPassword } from '@/utils/tools'
 
 const router = useRouter()
 
@@ -121,7 +122,8 @@ const handleConfirm = async () => {
 
   isLoading.value = true
 
-  fetchRegisterOrLogin({ ...formData, operationType: 'REGISTER' })
+  const encryptedPassword = encryptPassword(formData.password)
+  fetchRegisterOrLogin({ ...formData, password: encryptedPassword, operationType: 'REGISTER' })
     .then((res) => {
       console.log('res', res)
       showToast('register success')