lavender/test-client/index.html

93 lines
2.6 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<title>Test Client</title>
<script src="popup.js"></script>
<script>
let currentTokens = null;
const ssoService = "http://localhost:9090";
POP2.init(ssoService + "/authorize", "f4cdb93d-fe28-427b-b037-f03f44c86a16", "openid profile", 500, 600);
function updateTokenInfo(data) {
currentTokens = data.tokens;
data.tokens = {
access: "*****",
refresh: "*****",
}
document.getElementById("someTextArea").textContent = JSON.stringify(data, null, 2);
let perms = document.getElementById("somePerms");
while (perms.childNodes.length > 0) {
perms.childNodes.item(0).remove();
}
document.getElementById("tokenValues").textContent = JSON.stringify(currentTokens, null, 2);
let jwt = parseJwt(currentTokens.access);
if (jwt.per != null) {
jwt.per.forEach(function (x) {
let a = document.createElement("li");
a.textContent = x;
perms.appendChild(a);
});
}
}
function parseJwt(token) {
const base64Url = token.split('.')[1];
const base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/');
const jsonPayload = decodeURIComponent(window.atob(base64).split('').map(function (c) {
return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
}).join(''));
return JSON.parse(jsonPayload);
}
function doThisThing() {
POP2.getToken(function (token) {
console.log(token);
});
}
</script>
<style>
:root {
color-scheme: light dark;
}
#someTextArea {
width: 400px;
height: 400px;
}
#tokenValues {
width: 400px;
height: 400px;
}
</style>
</head>
<body>
<header>
<h1>Test Client</h1>
</header>
<main>
<div>
<button onclick="doThisThing();">Login</button>
</div>
<div style="display:flex; gap: 2em;">
<div>
<div>
<label for="someTextArea"></label><textarea id="someTextArea"></textarea>
</div>
<div>
<label for="tokenValues"></label><textarea id="tokenValues"></textarea>
</div>
</div>
<div>
<p>Permissions:</p>
<ul id="somePerms"></ul>
</div>
</div>
</main>
</body>
</html>