<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <title>SIB-OIDC test</title> <script type="module" src="./dist/index.js"></script> <style> .bu-test { border: 3px solid red; padding: 0.5rem; margin-bottom: 1rem; } .bu-test[data-src] { border-color: green; } .bu-test:after { content: "???"; } .bu-test[data-src]:after { color: green; content: attr(data-src); } </style> </head> <body> <h1>sib-oidc</h1> <div id="result"></div> <div bind-user class="bu-test">user-id:</div> <div> <button id="login">Se connecter</button> <button id="logout">Se déconnecter</button> </div> <sib-auth> <sib-auth-provider data-authority="https://api.test3.startinblox.com" data-id="test" ></sib-auth-provider> </sib-auth> <script type="module"> const sibAuth = document.querySelector("sib-auth") login.onclick = () => sibAuth.login() logout.onclick = () => sibAuth.logout() document.addEventListener("DOMContentLoaded", () => { sibAuth.getUser().then(user => { result.innerHTML = !user ? `Vous n'êtes pas connecté !` : `User Web-Id: <pre>${user["@id"]}</pre>` }); }) </script> </body> </html>