<script src="https://cdn.jsdelivr.net/npm/@authing/sso/dist/AuthingSSO.umd.min.js"></script>
<script>
let auth = new AuthingSSO({
appId: "YOUR_OIDC_APP_ID",
appType: "oidc",
appDomain: "OIDC_APP_DOMAIN.authing.cn"
});
</script>
监听按钮的点击事件
达到的效果是：
点击 login 按钮，浏览器会跳转到登录页面，与用户完成身份确认。
点击 trackSession 按钮，会显示当前登录状态。
点击 logout 按钮，进行单点登出。
let login =document.getElementById("btn-login");let trackSession =document.getElementById("btn-track-session");let logout =document.getElementById("btn-logout");login.onclick=function() {auth.login();};trackSession.onclick=asyncfunction() {let res =awaitauth.trackSession();alert(JSON.stringify(res));};logout.onclick=asyncfunction() {let res =awaitauth.logout();alert(JSON.stringify(res));};
完整代码
<!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>Authing SSO Example</title>
</head>
<body>
<button id="btn-login">login</button>
<button id="btn-track-session">trackSession</button>
<button id="btn-logout">logout</button>
<script src="https://cdn.jsdelivr.net/npm/@authing/sso/dist/AuthingSSO.umd.min.js"></script>
<script>
let auth = new AuthingSSO({
appId: "YOUR_OIDC_APP_ID",
appType: "oidc",
appDomain: "OIDC_APP_DOMAIN.authing.cn"
});
let login = document.getElementById("btn-login");
let trackSession = document.getElementById("btn-track-session");
let logout = document.getElementById("btn-logout");
login.onclick = function() {
auth.login();
};
trackSession.onclick = async function() {
let res = await auth.trackSession();
alert(JSON.stringify(res));
};
logout.onclick = async function() {
let res = await auth.logout();
alert(JSON.stringify(res));
};
</script>
</body>
</html>
