SSO单点登录iframe + postMessage SSO和Cookie SSO

张开发
2026/4/15 23:48:07 15 分钟阅读

分享文章

SSO单点登录iframe + postMessage SSO和Cookie SSO
iframe postMessage SSO适合a.com和*.a.com这种网站共用首屏速度快废话不多说直接展示代码a.com!DOCTYPE html html head meta charsetUTF-8 / titleSSO/title /head body script (function () { const token localStorage.getItem(token); const userInfo localStorage.getItem(user); const network sessionStorage.getItem(network); const language localStorage.getItem(i18nextLng); const artworkNid localStorage.getItem(artworkNid); window.parent.postMessage( { type: SSO_TOKEN, userInfo: userInfo, token: token, network: network, language: language, artworkNid: artworkNid, }, http://192.168.31.212:5050 ); })(); /script /body /html*.a.com(function () { const hostname location.hostname; // // 判断环境 // const isDev hostname localhost || hostname.startsWith(192.168) || hostname.startsWith(127.0.0.1); // console.log(当前环境:, isDev ? 开发环境 : 生产环境); // // 通用清空旧数据 // localStorage.removeItem(token); localStorage.removeItem(user); localStorage.removeItem(language); localStorage.removeItem(artworkNid); sessionStorage.removeItem(network); // // 生产环境逻辑Cookie SSO // function runProdSSO() { function getCookie(name) { const match document.cookie.match( new RegExp((^| ) name ([^;])) ); return match ? decodeURIComponent(match[2]) : null; } const raw getCookie(sso_data); if (!raw) { console.warn(没有 SSO 数据跳转登录); window.location.href ; // 你对应的登录网站 return; } try { const data JSON.parse(raw); localStorage.setItem(token, data.token || ); localStorage.setItem(user, data.user || ); localStorage.setItem(language, data.language || zh); localStorage.setItem(artworkNid, data.artworkNid || ); sessionStorage.setItem(network, data.network || ); // 删除 cookie必须单行 document.cookie sso_data; domain.biovisart.com; path/; max-age0; // 设置语言 window.mxLanguage data.language || zh; loadMainApp(); } catch (e) { console.error(SSO解析失败, e); window.location.href ;// 你对应的登录网站 } } // // 开发环境逻辑iframe postMessage // function runDevSSO() { console.log(执行开发环境 SSO); const baseUrl http://192.168.31.212:4000; const iframe document.createElement(iframe); iframe.src ${baseUrl}/sso.html; iframe.style.display none; document.body.appendChild(iframe); window.addEventListener(message, function handler(e) { if (e.origin ! baseUrl) return; const data e.data; if (data.type SSO_TOKEN) { document.body.removeChild(iframe); if (data.token) { localStorage.setItem(token, data.token); sessionStorage.setItem(network, data.network); localStorage.setItem(user, data.userInfo); localStorage.setItem(language, data.language); localStorage.setItem(artworkNid, data.artworkNid); window.mxLanguage data.language || zh; loadMainApp(); } else { window.location.href ${baseUrl}/login; } } }); } // // 通用加载 draw 主程序 // function loadMainApp() { const script document.createElement(script); script.src js/main.js; document.body.appendChild(script); } // // 执行入口 // if (isDev) { runDevSSO(); } else { runProdSSO(); } })();我的这块*.a.com代码是判断当前环境来执行对应的方法获取数据的因为Cookie SSO这种单点登录不支持开发中使用下面是另一种单点登录Cookie SSO方法*.a.com初始化都是上面的代码Button variantprimary onClick{() { localStorage.setItem(artworkNid, item?.nid); const data { token: localStorage.getItem(token), user: localStorage.getItem(user), language: localStorage.getItem(i18nextLng), artworkNid: localStorage.getItem(artworkNid), network: sessionStorage.getItem(network), }; document.cookie sso_data${encodeURIComponent(JSON.stringify(data))}; domain.biovisart.com; path/; max-age60; Secure; SameSiteNone; window.open(${baseDrawioUrl}, _blank); }}{t(use_templates)}/Button这个cookie实现比较简单登录跳转之前设置就行

更多文章