2023-10-04 21:53:20 +01:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="en">
|
|
|
|
|
<head>
|
2024-02-07 10:54:37 +00:00
|
|
|
<title>Test Client</title>
|
|
|
|
|
<script src="popup.js"></script>
|
|
|
|
|
<script>
|
|
|
|
|
let currentTokens = null;
|
|
|
|
|
const ssoService = "http://localhost:9090";
|
2023-10-04 21:53:20 +01:00
|
|
|
|
2024-02-08 01:25:14 +00:00
|
|
|
POP2.init(ssoService + "/authorize", "f4cdb93d-fe28-427b-b037-f03f44c86a16", "openid profile", 500, 600);
|
2023-12-05 18:10:47 +00:00
|
|
|
|
2024-02-07 10:54:37 +00:00
|
|
|
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);
|
2023-10-04 21:53:20 +01:00
|
|
|
|
2024-02-07 10:54:37 +00:00
|
|
|
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);
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
}
|
2023-10-04 21:53:20 +01:00
|
|
|
|
2024-02-07 10:54:37 +00:00
|
|
|
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);
|
|
|
|
|
}
|
2023-10-04 21:53:20 +01:00
|
|
|
|
2024-02-07 10:54:37 +00:00
|
|
|
function doThisThing() {
|
|
|
|
|
POP2.getToken(function (token) {
|
|
|
|
|
console.log(token);
|
|
|
|
|
});
|
|
|
|
|
}
|
2023-10-04 21:53:20 +01:00
|
|
|
|
|
|
|
|
|
2024-02-07 10:54:37 +00:00
|
|
|
</script>
|
|
|
|
|
<style>
|
|
|
|
|
:root {
|
|
|
|
|
color-scheme: light dark;
|
|
|
|
|
}
|
2023-10-10 18:06:06 +01:00
|
|
|
|
2024-02-07 10:54:37 +00:00
|
|
|
#someTextArea {
|
|
|
|
|
width: 400px;
|
|
|
|
|
height: 400px;
|
|
|
|
|
}
|
2023-10-10 18:06:06 +01:00
|
|
|
|
2024-02-07 10:54:37 +00:00
|
|
|
#tokenValues {
|
|
|
|
|
width: 400px;
|
|
|
|
|
height: 400px;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
2023-10-04 21:53:20 +01:00
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<header>
|
2024-02-07 10:54:37 +00:00
|
|
|
<h1>Test Client</h1>
|
2023-10-04 21:53:20 +01:00
|
|
|
</header>
|
|
|
|
|
<main>
|
|
|
|
|
<div>
|
2024-02-07 10:54:37 +00:00
|
|
|
<button onclick="doThisThing();">Login</button>
|
2023-10-04 21:53:20 +01:00
|
|
|
</div>
|
2024-02-07 10:54:37 +00:00
|
|
|
<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>
|
2023-10-04 21:53:20 +01:00
|
|
|
</div>
|
|
|
|
|
</main>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
