获取uuid与由uuid获取状态成功，待修复二维码生成功能

2024-06-01 17:27:16 +08:00 · 2024-06-01 17:27:16 +08:00 · 970f013f7a
parent ffcfabc65a
commit 970f013f7a
4 changed files with 265 additions and 2 deletions
--- a/package-lock.json
+++ b/package-lock.json
@ -11,9 +11,11 @@
        "axios": "^1.6.5",
        "cors": "^2.8.5",
        "element-plus": "^2.4.4",
+        "js-md5": "^0.8.3",
        "video.js": "^8.9.0",
        "vue": "^3.3.11",
        "vue-cookies": "^1.8.3",
+        "vue-qr": "^4.0.9",
        "vue-router": "^4.2.5"
      },
      "devDependencies": {
@ -961,6 +963,11 @@
        "proxy-from-env": "^1.1.0"
      }
    },
+    "node_modules/balanced-match": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
+      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="
+    },
    "node_modules/binary-extensions": {
      "version": "2.2.0",
      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
@ -970,6 +977,14 @@
        "node": ">=8"
      }
    },
+    "node_modules/brace-expansion": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
+      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
+      "dependencies": {
+        "balanced-match": "^1.0.0"
+      }
+    },
    "node_modules/braces": {
      "version": "3.0.2",
      "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
@ -1042,6 +1057,20 @@
      "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.10.tgz",
      "integrity": "sha512-vjAczensTgRcqDERK0SR2XMwsF/tSvnvlv6VcF2GIhg6Sx4yOIt/irsr1RDJsKiIyBzJDpCoXiWWq28MqH2cnQ=="
    },
+    "node_modules/decompress-response": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/decompress-response/-/decompress-response-6.0.0.tgz",
+      "integrity": "sha512-aW35yZM6Bb/4oJlZncMH2LCoZtJXTRxES17vE3hoRiowU2kWHaJKFkSBDnDR+cm9J+9QhXmREyIfv0pji9ejCQ==",
+      "dependencies": {
+        "mimic-response": "^3.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
    "node_modules/delayed-stream": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
@ -1183,6 +1212,11 @@
        "node": ">= 6"
      }
    },
+    "node_modules/fs.realpath": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
+      "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw=="
+    },
    "node_modules/fsevents": {
      "version": "2.3.3",
      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
@ -1197,6 +1231,25 @@
        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
      }
    },
+    "node_modules/glob": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-8.1.0.tgz",
+      "integrity": "sha512-r8hpEjiQEYlF2QU0df3dS+nxxSIreXQS1qRhMJM0Q5NDdR386C7jb7Hwwod8Fgiuex+k0GFjgft18yvxm5XoCQ==",
+      "deprecated": "Glob versions prior to v9 are no longer supported",
+      "dependencies": {
+        "fs.realpath": "^1.0.0",
+        "inflight": "^1.0.4",
+        "inherits": "2",
+        "minimatch": "^5.0.1",
+        "once": "^1.3.0"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
    "node_modules/glob-parent": {
      "version": "5.1.2",
      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
@ -1229,6 +1282,21 @@
      "resolved": "https://registry.npmjs.org/individual/-/individual-2.0.0.tgz",
      "integrity": "sha512-pWt8hBCqJsUWI/HtcfWod7+N9SgAqyPEaF7JQjwzjn5vGrpg6aQ5qeAFQ7dx//UH4J1O+7xqew+gCeeFt6xN/g=="
    },
+    "node_modules/inflight": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
+      "integrity": "sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==",
+      "deprecated": "This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.",
+      "dependencies": {
+        "once": "^1.3.0",
+        "wrappy": "1"
+      }
+    },
+    "node_modules/inherits": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
+      "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ=="
+    },
    "node_modules/is-binary-path": {
      "version": "2.1.0",
      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
@ -1276,6 +1344,16 @@
        "node": ">=0.12.0"
      }
    },
+    "node_modules/js-binary-schema-parser": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/js-binary-schema-parser/-/js-binary-schema-parser-2.0.3.tgz",
+      "integrity": "sha512-xezGJmOb4lk/M1ZZLTR/jaBHQ4gG/lqQnJqdIv4721DMggsa1bDVlHXNeHYogaIEHD9vCRv0fcL4hMA+Coarkg=="
+    },
+    "node_modules/js-md5": {
+      "version": "0.8.3",
+      "resolved": "https://registry.npmjs.org/js-md5/-/js-md5-0.8.3.tgz",
+      "integrity": "sha512-qR0HB5uP6wCuRMrWPTrkMaev7MJZwJuuw4fnwAzRgP4J4/F8RwtodOKpGp4XpqsLBFzzgqIO42efFAyz2Et6KQ=="
+    },
    "node_modules/keycode": {
      "version": "2.2.0",
      "resolved": "https://registry.npmjs.org/keycode/-/keycode-2.2.0.tgz",
@ -1360,6 +1438,17 @@
        "node": ">= 0.6"
      }
    },
+    "node_modules/mimic-response": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/mimic-response/-/mimic-response-3.1.0.tgz",
+      "integrity": "sha512-z0yWI+4FDrrweS8Zmt4Ej5HdJmky15+L2e6Wgn3+iK5fWzb6T3fhNFq2+MeTRb064c6Wr4N/wv0DzQTjNzHNGQ==",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
    "node_modules/min-document": {
      "version": "2.19.0",
      "resolved": "https://registry.npmjs.org/min-document/-/min-document-2.19.0.tgz",
@ -1368,6 +1457,17 @@
        "dom-walk": "^0.1.0"
      }
    },
+    "node_modules/minimatch": {
+      "version": "5.1.6",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-5.1.6.tgz",
+      "integrity": "sha512-lKwV/1brpG6mBUFHtb7NUmtABCb2WZZmm2wNiOA5hAb8VdCS4B3dtMWyvcoViccwAW/COERjXLt0zP1zXUN26g==",
+      "dependencies": {
+        "brace-expansion": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
    "node_modules/mpd-parser": {
      "version": "1.3.0",
      "resolved": "https://registry.npmjs.org/mpd-parser/-/mpd-parser-1.3.0.tgz",
@ -1437,6 +1537,19 @@
        "node": ">=0.10.0"
      }
    },
+    "node_modules/once": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
+      "integrity": "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==",
+      "dependencies": {
+        "wrappy": "1"
+      }
+    },
+    "node_modules/parenthesis": {
+      "version": "3.1.8",
+      "resolved": "https://registry.npmjs.org/parenthesis/-/parenthesis-3.1.8.tgz",
+      "integrity": "sha512-KF/U8tk54BgQewkJPvB4s/US3VQY68BRDpH638+7O/n58TpnwiwnOtGIOsT2/i+M78s61BBpeC83STB88d8sqw=="
+    },
    "node_modules/picocolors": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
@ -1587,6 +1700,49 @@
        "node": ">=14.0.0"
      }
    },
+    "node_modules/simple-concat": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/simple-concat/-/simple-concat-1.0.1.tgz",
+      "integrity": "sha512-cSFtAPtRhljv69IK0hTVZQ+OfE9nePi/rtJmw5UjHeVyVroEqJXP1sFztKUy1qU+xvz3u/sfYJLa947b7nAN2Q==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ]
+    },
+    "node_modules/simple-get": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/simple-get/-/simple-get-4.0.1.tgz",
+      "integrity": "sha512-brv7p5WgH0jmQJr1ZDDfKDOSeWWg+OVypG99A/5vYGPqJ6pxiaHLy8nxtFjBA7oMa01ebA9gfh1uMCFqOuXxvA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "dependencies": {
+        "decompress-response": "^6.0.0",
+        "once": "^1.3.1",
+        "simple-concat": "^1.0.0"
+      }
+    },
    "node_modules/source-map-js": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
@ -1595,6 +1751,14 @@
        "node": ">=0.10.0"
      }
    },
+    "node_modules/string-split-by": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/string-split-by/-/string-split-by-1.0.0.tgz",
+      "integrity": "sha512-KaJKY+hfpzNyet/emP81PJA9hTVSfxNLS9SFTWxdCnnW1/zOOwiV248+EfoX7IQFcBaOp4G5YE6xTJMF+pLg6A==",
+      "dependencies": {
+        "parenthesis": "^3.1.5"
+      }
+    },
    "node_modules/to-regex-range": {
      "version": "5.0.1",
      "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
@ -1749,6 +1913,17 @@
      "resolved": "https://registry.npmjs.org/vue-cookies/-/vue-cookies-1.8.3.tgz",
      "integrity": "sha512-VBRsyRMVdahBgFfh389TMHPmDdr4URDJNMk4FKSCfuNITs7+jitBDhwyL4RJd3WUsfOYNNjPAkfbehyH9AFuoA=="
    },
+    "node_modules/vue-qr": {
+      "version": "4.0.9",
+      "resolved": "https://registry.npmjs.org/vue-qr/-/vue-qr-4.0.9.tgz",
+      "integrity": "sha512-pAISV94T0MNEYA3NGjykUpsXRE2QfaNxlu9ZhEL6CERgqNc21hJYuP3hRVzAWfBQlgO18DPmZTbrFerJC3+Ikw==",
+      "dependencies": {
+        "glob": "^8.0.1",
+        "js-binary-schema-parser": "^2.0.2",
+        "simple-get": "^4.0.1",
+        "string-split-by": "^1.0.0"
+      }
+    },
    "node_modules/vue-router": {
      "version": "4.2.5",
      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.2.5.tgz",
@ -1762,6 +1937,11 @@
      "peerDependencies": {
        "vue": "^3.2.0"
      }
+    },
+    "node_modules/wrappy": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
+      "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ=="
    }
  }
 }
--- a/package.json
+++ b/package.json
@ -12,9 +12,11 @@
    "axios": "^1.6.5",
    "cors": "^2.8.5",
    "element-plus": "^2.4.4",
+    "js-md5": "^0.8.3",
    "video.js": "^8.9.0",
    "vue": "^3.3.11",
    "vue-cookies": "^1.8.3",
+    "vue-qr": "^4.0.9",
    "vue-router": "^4.2.5"
  },
  "devDependencies": {
--- a/src/api/user.js
+++ b/src/api/user.js
@ -1,8 +1,13 @@
 import request from '@/utils/request.js'
+import md5 from 'js-md5';

 export const loginService = (loginData) => {
    const params = new URLSearchParams();
    for (let key in loginData) {
+        if (key === 'password') {
+            params.append(key, md5(loginData[key]))
+            continue;
+        }
        params.append(key, loginData[key])
    }
    return request.post('/user/login', params)
@ -15,3 +20,22 @@ export const registerService = (registerData) => {
    }
    return request.post('/user/register', params)
 }
+
+
+
+export const getUUIDService = (registerData) => {
+    const params = new URLSearchParams();
+    for (let key in registerData) {
+        params.append(key, registerData[key])
+    }
+    return request.post('/user/uuid', params)
+}
+
+export const getQRService = (qrData) => {
+    const params = new URLSearchParams();
+    console.log("qrdata=",qrData);
+    for (let key in qrData) {
+        params.append(key, qrData[key])
+    }
+    return request.post('/user/gqr', params)
+}
--- a/src/views/Login.vue
+++ b/src/views/Login.vue
@ -85,20 +85,28 @@
      </el-form-item>
    </el-form>
  </el-row>
+  <div>
+    <div class="qrcode" ref="qrCodeUrl"></div>
+    <vue-qr :logoSrc="imageUrl" text="https://blog.csdn.net/weixin_42601136" :size="200"></vue-qr>
+  </div>
 </template>

 <script setup>
 import { ref, inject } from "vue";
 import axios from "axios";
-import { loginService, registerService } from "@/api/user.js";
+import { getQRService, getUUIDService, loginService, registerService } from "@/api/user.js";
 import router from "@/router/index.js";
+import VueQr from 'vue-qr'
 const isLogin = ref(true);
 if (localStorage.getItem("token") !== null) {
  router.push("/videoList");
 }

+
 const globalData = inject("globalData");

+var uuid = "";
+//表单数据
 var loginData = ref({
  username: "",
  email: "lijun.lj@foxmail.com",
@ -135,6 +143,17 @@ const rules = {
  email: [{}],
 };

+const creatQrCode =async () =>{
+      var qrcode = new qrcode(this.$refs.qrCodeUrl, {
+        text: uuid, // 需要转换为二维码的内容
+        width: 100,
+        height: 100,
+        colorDark: "#000000",
+        colorLight: "#ffffff",
+        correctLevel: QRCode.CorrectLevel.H,
+      });
+    };
+
 //登录接口调用
 const login = async () => {
  //   let req = axios.create({
@ -155,7 +174,7 @@ const login = async () => {
  //     .catch((error) => {
  //       console.error(error);
  //     });
-  let result = await loginService(loginData.value);
+  let result = await loginService(loginData);
  globalData.token = result.data;
  localStorage.setItem("token", result.data.token);
  localStorage.setItem("userId", result.data.id);
@ -165,6 +184,41 @@ const login = async () => {
  //token.value= result.data;
  router.push("/videoList");
 };
+
+const getUUID= async() => {
+      try {
+        const response = await getUUIDService({"device":"windows"});
+        uuid =response.data.toString();
+        let uid =uuid.toString();
+        console.log("uuid=",uuid);
+        await creatQrCode(uid);
+      } catch (error) {
+        console.error(error);
+      }
+    };
+
+const getQRStatus = async () => {
+  let result = await getQRService({"uuid":uuid});
+  if (result.code === 0) {
+    if(result.data==="0"){
+    }else if(result.data==="1"){
+      alert("等待确认");
+    }else{
+      globalData.token = result.data;
+      localStorage.setItem("token", result.data.token);
+      localStorage.setItem("userId", result.data.id);
+      localStorage.setItem("username", result.data.username);
+      let now=new Date();
+      localStorage.setItem("end_time", now.setDate(now.getHours() + 12));//过期时间
+      //token.value= result.data;
+      router.push("/videoList");
+    }
+
+  } else {
+    alert(result.message);
+  }
+}
+
 const  getIpClient= async() => {
      try {
        const response = await axios.get("https://ipinfo.io/json");
@ -181,6 +235,9 @@ const  getIpClient= async() => {
    };

 getIpClient();
+await getUUID();
+getQRStatus();
+setInterval("getQRStatus()","1000");//showLogin()函数名一定要带括号
 const register = async () => {
  let result = registerService(registerData.value);
  if (result.code === 0) {