You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
58 lines
2.0 KiB
58 lines
2.0 KiB
--- |
|
permalink: /qr-login.html |
|
layout: default |
|
--- |
|
|
|
<style> |
|
body { |
|
text-align: center; |
|
} |
|
.selectable { |
|
-webkit-user-select: all; |
|
user-select: all; |
|
cursor: pointer; |
|
padding: 5px; |
|
background-color: #b2b2b2; |
|
border-radius: 5px; |
|
display: inline-block; |
|
margin-top: 10px; |
|
} |
|
</style> |
|
<script src="https://cdn.jsdelivr.net/npm/qrcode@1.4.4/build/qrcode.min.js"></script> |
|
<script> |
|
function generateQRCode() { |
|
const urlParams = new URLSearchParams(window.location.search); |
|
const verificationUri = urlParams.get('verificationUri'); |
|
const userCode = urlParams.get('userCode'); |
|
const login = urlParams.get('login'); |
|
if (!verificationUri || !userCode) { |
|
return; // 不显示任何内容 |
|
} |
|
const qrcodeContainer = document.getElementById('qrcode'); |
|
if (login === '1') { |
|
const userPrompt = document.createElement('p'); |
|
userPrompt.innerHTML = `请复制代码 <span class="selectable" id="userCode">${userCode}</span> <br>并前往 <a href="${verificationUri}">${verificationUri}</a>，输入代码允许访问并登录微软账户。`; |
|
qrcodeContainer.appendChild(userPrompt); |
|
} else { |
|
const currentUrl = window.location.href + '&login=1'; |
|
console.log("currentUrl: ", currentUrl); |
|
const canvas = document.createElement('canvas'); |
|
QRCode.toCanvas(canvas, currentUrl, function (error) { |
|
if (error) console.error(error); |
|
}); |
|
qrcodeContainer.appendChild(canvas); |
|
const promptMessage = document.createElement('p'); |
|
promptMessage.innerHTML = `请扫描二维码。`; |
|
qrcodeContainer.appendChild(promptMessage); |
|
} |
|
} |
|
window.onload = function() { |
|
generateQRCode(); |
|
} |
|
</script> |
|
|
|
<div id="qrcode"></div> |
|
|
|
<noscript> |
|
<p>请开启 JavaScript 以查看二维码生成内容。</p> |
|
</noscript>
|
|
|