2025-02-28 03:05:52 +08:00

92 lines
2.4 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1, user-scalable=no">
<title>主页</title>
<style>
* {
box-sizing: border-box;
}
html,
body {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
#qrcode {
width: 500px;
height: 500px;
margin: 0 auto;
}
</style>
</head>
<body>
<!-- <canvas id="qrcode"></canvas> -->
<img id="qrcode" />
<script type="module">
import { loginUrl, loginSuccessUrl } from './config.js'
import QRCode from 'https://cdn.jsdelivr.net/npm/qrcode@1.5.4/+esm'
const url = new URL(window.location.href)
const redirect = url.searchParams.get('redirect')
const redirectURL = redirect ? decodeURIComponent(redirect) : loginSuccessUrl
var opts = {
errorCorrectionLevel: 'H',
type: 'image/jpeg',
quality: 0.3,
margin: 1,
// color: {
// dark: "#010599FF",
// light: "#FFBF60FF"
// }
}
let state = ''
let timer = null
const createQrcode = (state) => {
const text = `${loginUrl}?state=${state}`
QRCode.toDataURL(text, opts, function (err, url) {
if (err) throw err
var img = document.getElementById('qrcode')
img.src = url
})
}
const checkLogin = async () => {
const res = await fetch(`/api/router?path=wx&key=checkLogin&state=${state}`).then(res => res.json())
if (res.code === 200) {
const token = res.data.token
if (token) {
localStorage.setItem('token', token)
}
document.body.innerHTML = `<h1>登录成功</h1>`
setTimeout(() => {
window.location.href = redirectURL
}, 1000)
} else {
timer = setTimeout(() => {
checkLogin()
}, 1000)
}
}
// 随机生成一个state
state = Math.random().toString(36).substring(2, 15)
createQrcode(state)
checkLogin()
setInterval(() => {
state = Math.random().toString(36).substring(2, 15)
clearTimeout(timer) // 清除定时器
createQrcode(state) // 90秒后更新二维码
checkLogin()
}, 90000)
</script>
</body>
</html>