完成二维码生成及根据uuid获取扫码登录信息,可以进行正常登录

This commit is contained in:
junleea 2024-06-08 15:43:14 +08:00
parent cd6d70e27c
commit 4c10a214a3
4 changed files with 482 additions and 139 deletions

283
package-lock.json generated
View File

@ -12,6 +12,7 @@
"cors": "^2.8.5",
"element-plus": "^2.4.4",
"js-md5": "^0.8.3",
"qrcode": "^1.5.3",
"video.js": "^8.9.0",
"vue": "^3.3.11",
"vue-cookies": "^1.8.3",
@ -930,6 +931,28 @@
"npm": ">=5"
}
},
"node_modules/ansi-regex": {
"version": "5.0.1",
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
"integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
"engines": {
"node": ">=8"
}
},
"node_modules/ansi-styles": {
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
"dependencies": {
"color-convert": "^2.0.1"
},
"engines": {
"node": ">=8"
},
"funding": {
"url": "https://github.com/chalk/ansi-styles?sponsor=1"
}
},
"node_modules/anymatch": {
"version": "3.1.3",
"resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
@ -997,6 +1020,14 @@
"node": ">=8"
}
},
"node_modules/camelcase": {
"version": "5.3.1",
"resolved": "https://registry.npmjs.org/camelcase/-/camelcase-5.3.1.tgz",
"integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==",
"engines": {
"node": ">=6"
}
},
"node_modules/chokidar": {
"version": "3.5.3",
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz",
@ -1024,6 +1055,32 @@
"fsevents": "~2.3.2"
}
},
"node_modules/cliui": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/cliui/-/cliui-6.0.0.tgz",
"integrity": "sha512-t6wbgtoCXvAzst7QgXxJYqPt0usEfbgQdftEPbLL/cvv6HPE5VgvqCuAIDR0NgU52ds6rFwqrgakNLrHEjCbrQ==",
"dependencies": {
"string-width": "^4.2.0",
"strip-ansi": "^6.0.0",
"wrap-ansi": "^6.2.0"
}
},
"node_modules/color-convert": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
"dependencies": {
"color-name": "~1.1.4"
},
"engines": {
"node": ">=7.0.0"
}
},
"node_modules/color-name": {
"version": "1.1.4",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
},
"node_modules/combined-stream": {
"version": "1.0.8",
"resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
@ -1057,6 +1114,14 @@
"resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.10.tgz",
"integrity": "sha512-vjAczensTgRcqDERK0SR2XMwsF/tSvnvlv6VcF2GIhg6Sx4yOIt/irsr1RDJsKiIyBzJDpCoXiWWq28MqH2cnQ=="
},
"node_modules/decamelize": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
"integrity": "sha512-z2S+W9X73hAUUki+N+9Za2lBlun89zigOyGrsax+KUQ6wKW4ZoWpEYBkGhQjwAjjDCkWxhY0VKEhk8wzY7F5cA==",
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/decompress-response": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/decompress-response/-/decompress-response-6.0.0.tgz",
@ -1079,6 +1144,11 @@
"node": ">=0.4.0"
}
},
"node_modules/dijkstrajs": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/dijkstrajs/-/dijkstrajs-1.0.3.tgz",
"integrity": "sha512-qiSlmBq9+BCdCA/L46dw8Uy93mloxsPSbwnm5yrKn2vMPiy8KyAskTF6zuV/j5BMsmOGZDPs7KjU+mjb670kfA=="
},
"node_modules/dom-walk": {
"version": "0.1.2",
"resolved": "https://registry.npmjs.org/dom-walk/-/dom-walk-0.1.2.tgz",
@ -1109,6 +1179,16 @@
"vue": "^3.2.0"
}
},
"node_modules/emoji-regex": {
"version": "8.0.0",
"resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
"integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="
},
"node_modules/encode-utf8": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/encode-utf8/-/encode-utf8-1.0.3.tgz",
"integrity": "sha512-ucAnuBEhUK4boH2HjVYG5Q2mQyPorvv0u/ocS+zhdw0S8AlHYY+GOFhP1Gio5z4icpP2ivFSvhtFjQi8+T9ppw=="
},
"node_modules/entities": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz",
@ -1180,6 +1260,18 @@
"node": ">=8"
}
},
"node_modules/find-up": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz",
"integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==",
"dependencies": {
"locate-path": "^5.0.0",
"path-exists": "^4.0.0"
},
"engines": {
"node": ">=8"
}
},
"node_modules/follow-redirects": {
"version": "1.15.4",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.4.tgz",
@ -1231,6 +1323,14 @@
"node": "^8.16.0 || ^10.6.0 || >=11.0.0"
}
},
"node_modules/get-caller-file": {
"version": "2.0.5",
"resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
"integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
"engines": {
"node": "6.* || 8.* || >= 10.*"
}
},
"node_modules/glob": {
"version": "8.1.0",
"resolved": "https://registry.npmjs.org/glob/-/glob-8.1.0.tgz",
@ -1318,6 +1418,14 @@
"node": ">=0.10.0"
}
},
"node_modules/is-fullwidth-code-point": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
"integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
"engines": {
"node": ">=8"
}
},
"node_modules/is-function": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/is-function/-/is-function-1.0.2.tgz",
@ -1359,6 +1467,17 @@
"resolved": "https://registry.npmjs.org/keycode/-/keycode-2.2.0.tgz",
"integrity": "sha512-ps3I9jAdNtRpJrbBvQjpzyFbss/skHqzS+eu4RxKLaEAtFqkjZaB6TZMSivPbLxf4K7VI4SjR0P5mRCX5+Q25A=="
},
"node_modules/locate-path": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
"integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==",
"dependencies": {
"p-locate": "^4.1.0"
},
"engines": {
"node": ">=8"
}
},
"node_modules/lodash": {
"version": "4.17.21",
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
@ -1545,11 +1664,52 @@
"wrappy": "1"
}
},
"node_modules/p-limit": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz",
"integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
"dependencies": {
"p-try": "^2.0.0"
},
"engines": {
"node": ">=6"
},
"funding": {
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/p-locate": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz",
"integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==",
"dependencies": {
"p-limit": "^2.2.0"
},
"engines": {
"node": ">=8"
}
},
"node_modules/p-try": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz",
"integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==",
"engines": {
"node": ">=6"
}
},
"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/path-exists": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
"integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==",
"engines": {
"node": ">=8"
}
},
"node_modules/picocolors": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
@ -1578,6 +1738,14 @@
"pkcs7": "bin/cli.js"
}
},
"node_modules/pngjs": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/pngjs/-/pngjs-5.0.0.tgz",
"integrity": "sha512-40QW5YalBNfQo5yRYmiw7Yz6TKKVr3h6970B2YE+3fQpsWcrbj1PzJgxeJ19DRQjhMbKPIuMY8rFaXc8moolVw==",
"engines": {
"node": ">=10.13.0"
}
},
"node_modules/postcss": {
"version": "8.4.33",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.33.tgz",
@ -1618,6 +1786,23 @@
"resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
"integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="
},
"node_modules/qrcode": {
"version": "1.5.3",
"resolved": "https://registry.npmjs.org/qrcode/-/qrcode-1.5.3.tgz",
"integrity": "sha512-puyri6ApkEHYiVl4CFzo1tDkAZ+ATcnbJrJ6RiBM1Fhctdn/ix9MTE3hRph33omisEbC/2fcfemsseiKgBPKZg==",
"dependencies": {
"dijkstrajs": "^1.0.1",
"encode-utf8": "^1.0.3",
"pngjs": "^5.0.0",
"yargs": "^15.3.1"
},
"bin": {
"qrcode": "bin/qrcode"
},
"engines": {
"node": ">=10.13.0"
}
},
"node_modules/readdirp": {
"version": "3.6.0",
"resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
@ -1635,6 +1820,19 @@
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz",
"integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw=="
},
"node_modules/require-directory": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
"integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==",
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/require-main-filename": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz",
"integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg=="
},
"node_modules/rollup": {
"version": "4.9.4",
"resolved": "https://registry.npmjs.org/rollup/-/rollup-4.9.4.tgz",
@ -1700,6 +1898,11 @@
"node": ">=14.0.0"
}
},
"node_modules/set-blocking": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
"integrity": "sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw=="
},
"node_modules/simple-concat": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/simple-concat/-/simple-concat-1.0.1.tgz",
@ -1759,6 +1962,30 @@
"parenthesis": "^3.1.5"
}
},
"node_modules/string-width": {
"version": "4.2.3",
"resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
"integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
"dependencies": {
"emoji-regex": "^8.0.0",
"is-fullwidth-code-point": "^3.0.0",
"strip-ansi": "^6.0.1"
},
"engines": {
"node": ">=8"
}
},
"node_modules/strip-ansi": {
"version": "6.0.1",
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
"integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
"dependencies": {
"ansi-regex": "^5.0.1"
},
"engines": {
"node": ">=8"
}
},
"node_modules/to-regex-range": {
"version": "5.0.1",
"resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
@ -1938,10 +2165,66 @@
"vue": "^3.2.0"
}
},
"node_modules/which-module": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.1.tgz",
"integrity": "sha512-iBdZ57RDvnOR9AGBhML2vFZf7h8vmBjhoaZqODJBFWHVtKkDmKuHai3cx5PgVMrX5YDNp27AofYbAwctSS+vhQ=="
},
"node_modules/wrap-ansi": {
"version": "6.2.0",
"resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-6.2.0.tgz",
"integrity": "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==",
"dependencies": {
"ansi-styles": "^4.0.0",
"string-width": "^4.1.0",
"strip-ansi": "^6.0.0"
},
"engines": {
"node": ">=8"
}
},
"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=="
},
"node_modules/y18n": {
"version": "4.0.3",
"resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.3.tgz",
"integrity": "sha512-JKhqTOwSrqNA1NY5lSztJ1GrBiUodLMmIZuLiDaMRJ+itFd+ABVE8XBjOvIWL+rSqNDC74LCSFmlb/U4UZ4hJQ=="
},
"node_modules/yargs": {
"version": "15.4.1",
"resolved": "https://registry.npmjs.org/yargs/-/yargs-15.4.1.tgz",
"integrity": "sha512-aePbxDmcYW++PaqBsJ+HYUFwCdv4LVvdnhBy78E57PIor8/OVvhMrADFFEDh8DHDFRv/O9i3lPhsENjO7QX0+A==",
"dependencies": {
"cliui": "^6.0.0",
"decamelize": "^1.2.0",
"find-up": "^4.1.0",
"get-caller-file": "^2.0.1",
"require-directory": "^2.1.1",
"require-main-filename": "^2.0.0",
"set-blocking": "^2.0.0",
"string-width": "^4.2.0",
"which-module": "^2.0.0",
"y18n": "^4.0.0",
"yargs-parser": "^18.1.2"
},
"engines": {
"node": ">=8"
}
},
"node_modules/yargs-parser": {
"version": "18.1.3",
"resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-18.1.3.tgz",
"integrity": "sha512-o50j0JeToy/4K6OZcaQmW6lyXXKhq7csREXcDwk2omFPJEwUNOVtJKvmDr9EI1fAJZUyZcRF7kxGBWmRXudrCQ==",
"dependencies": {
"camelcase": "^5.0.0",
"decamelize": "^1.2.0"
},
"engines": {
"node": ">=6"
}
}
}
}

View File

@ -13,6 +13,7 @@
"cors": "^2.8.5",
"element-plus": "^2.4.4",
"js-md5": "^0.8.3",
"qrcode": "^1.5.3",
"video.js": "^8.9.0",
"vue": "^3.3.11",
"vue-cookies": "^1.8.3",

View File

@ -3,6 +3,7 @@ import md5 from 'js-md5';
export const loginService = (loginData) => {
const params = new URLSearchParams();
loginData = loginData._value;
for (let key in loginData) {
if (key === "username") {
//正则表达式判断邮箱
@ -39,7 +40,7 @@ export const getUUIDService = (registerData) => {
export const getQRService = (qrData) => {
const params = new URLSearchParams();
console.log("qrdata=",qrData);
//console.log("qrdata=",qrData);
for (let key in qrData) {
params.append(key, qrData[key])
}

View File

@ -86,160 +86,218 @@
</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>
<canvas ref="qrCodeCanvas"></canvas>
</div>
</template>
<script setup>
import { ref, onMounted, inject } from "vue";
import axios from "axios";
import { getQRService, getUUIDService, loginService, registerService } from "@/api/user.js";
import router from "@/router/index.js";
import VueQr from 'vue-qr'; //
import { ref, onMounted, inject,onUnmounted } from "vue";
import axios from "axios";
import {
getQRService,
getUUIDService,
loginService,
registerService,
} from "@/api/user.js";
import router from "@/router/index.js";
import VueQr from "vue-qr"; //
import QRCode from "qrcode";
export default {
components: {
VueQr, // VueQr
},
setup() {
const isLogin = ref(true);
const globalData = inject("globalData");
var uuid = "";
//
var loginData = ref({
username: "",
email: "lijun.lj@foxmail.com",
password: "",
ip:"",
});l
const registerData = ref({
username: "",
email: "",
password: "",
repassword: "",
});
const isLogin = ref(true);
const qrCodeCanvas = ref(null);
const globalData = inject("globalData");
//
const rules = {
password: [
{ required: true, message: "请输入密码", trigger: "blur" },
{
min: 6,
max: 20,
message: "密码长度在 6 到 20 个字符",
trigger: "blur",
// ID
const intervalId = ref(null);
var uuid = "";
//
var loginData = ref({
username: "",
email: "",
password: "",
ip: "",
});
const registerData = ref({
username: "",
email: "",
password: "",
repassword: "",
});
//
const rules = {
password: [
{ required: true, message: "请输入密码", trigger: "blur" },
{
min: 6,
max: 20,
message: "密码长度在 6 到 20 个字符",
trigger: "blur",
},
],
username: [
{ required: true, message: "请输入用户名", trigger: "blur" },
{
min: 5,
max: 20,
message: "用户名长度在 6 到 20 个字符",
trigger: "blur",
},
],
email: [{}],
};
onMounted(() => {
init();
startInterval();
const token = localStorage.getItem("token");
if (token !== null) {
isLogin.value = true; //
router.push("/videoList"); //
// UID uid.value
}
});
onUnmounted(() => {
stopInterval();
});
//
const startInterval = () => {
if (intervalId.value) {
//
return;
}
intervalId.value = setInterval(getQRStatus, 1000);
};
//
const stopInterval = () => {
if (intervalId.value) {
clearInterval(intervalId.value);
intervalId.value = null; // ID
}
};
const creatQrCode = async () => {
console.log("creatQrCode:", uuid);
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 result = await loginService(loginData);
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");
};
const generateQRCode = () => {
//
const data = uuid;
// canvas DOM
if (qrCodeCanvas.value) {
const canvas = qrCodeCanvas.value;
const ctx = canvas.getContext("2d");
// canvas
canvas.width = 256;
canvas.height = 256;
// 使 qrcode
QRCode.toCanvas(
canvas,
data,
{
width: 256,
height: 256,
color: {
dark: "#000000",
light: "#ffffff",
},
],
username: [
{ required: true, message: "请输入用户名", trigger: "blur" },
{
min: 5,
max: 20,
message: "用户名长度在 6 到 20 个字符",
trigger: "blur",
},
],
email: [{}],
};
onMounted(() => {
const token = localStorage.getItem("token");
if (token !== null) {
isLogin.value = true; //
router.push("/videoList"); //
// UID uid.value
}
});
},
function (error) {
if (error) console.error(error);
console.log("二维码已生成");
}
);
}
};
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 getUUID = async () => {
try {
const response = await getUUIDService({ device: "windows" });
uuid = response.data.toString();
let uid = uuid.toString();
console.log("uuid=", uuid);
//await creatQrCode(uid);
generateQRCode(uuid);
} catch (error) {
console.log(error);
}
};
//
const login = async () => {
let result = await loginService(loginData);
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));//
let now = new Date();
localStorage.setItem("end_time", now.setDate(now.getHours() + 12)); //
//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");
loginData.value.ip =response.data.ip;
localStorage.setItem("ip", response.data.ip);
localStorage.setItem("city", response.data.city);
// console.log("ip:",response.data.ip);
// console.log("login ip:",loginData.ip);
// console.log(response.data);
// console.log(loginData);
} catch (error) {
console.error(error);
}
};
getIpClient();
await getUUID();
getQRStatus();
setInterval("getQRStatus()","1000");//showLogin()
const register = async () => {
let result = registerService(registerData.value);
if (result.code === 0) {
alert(result.message);
} else {
alert(result.message);
}
};
},
} else {
alert(result.message);
}
};
const getIpClient = async () => {
try {
const response = await axios.get("https://ipinfo.io/json");
loginData.value.ip = response.data.ip;
localStorage.setItem("ip", response.data.ip);
localStorage.setItem("city", response.data.city);
// console.log("ip:",response.data.ip);
// console.log("login ip:",loginData.ip);
// console.log(response.data);
// console.log(loginData);
} catch (error) {
console.error(error);
}
};
const init = async () => {
getIpClient();
getUUID();
};
const register = async () => {
let result = registerService(registerData.value);
if (result.code === 0) {
alert(result.message);
} else {
alert(result.message);
}
};
</script>
<style scoped>
canvas {
border: 1px solid #000;
}
</style>