登录密码md5加密

package.json

@@ -20,6 +20,7 @@
     "dayjs": "1.11.13",
     "element-plus": "2.9.7",
     "js-cookie": "3.0.5",
+    "js-md5": "0.8.3",
     "lodash-es": "4.17.21",
     "mitt": "3.0.1",
     "normalize.css": "8.0.1",

src/main.ts

@@ -12,10 +12,12 @@ import "element-plus/theme-chalk/dark/css-vars.css";
 import "vxe-table/lib/style.css";
 import "@@/assets/styles/index.scss";
 import "virtual:uno.css";
+import md5 from 'js-md5';
 
 // 创建应用实例
 const app = createApp(App);
-
+//md5
+app.provide('md5', md5);
 // 安装插件（全局组件、自定义指令等）
 installPlugins(app);
 

src/pages/login/index.vue

@@ -12,7 +12,9 @@ import { Lock, User, Iphone, Promotion, Check } from "@element-plus/icons-vue";
 import { loginApi } from "./apis";
 import Owl from "./components/Owl.vue";
 import { useFocus } from "./composables/useFocus";
-import { reactive, ref } from "vue";
+import { reactive, ref ,inject } from "vue";
+const $md5 = inject('md5')
+
 const router = useRouter();
 
 const userStore = useUserStore();
@@ -154,6 +156,7 @@ async function handleUserLogin(formEl) {
   await formEl.validate((valid, fields) => {
     if (valid) {
       loading.value = true;
+      loginFormData.password = $md5(loginFormData.password)
       loginApi(loginFormData)
         .then(({ data }) => {
           userStore.setToken(data.token);