HTML中iframe实现单点登录免密跨域跳转的配置教程-html教程-PHP中文网

postmessage是当前唯一无需服务端配合、能安全完成iframe跨域通信的标准方案；但必须严格校验event.origin并精确指定targetorigin，否则存在xss风险，且需确保iframe加载完成后再发送消息。

html中iframe实现单点登录免密跨域跳转的配置教程

iframe src 跳转时如何携带登录凭证而不暴露密码

直接在 src 里拼接 username 和 password 是危险且不可靠的——URL 会被浏览器历史、代理、日志记录，且目标系统若未校验 referer 或签名，极易被重放。真正可行的方式是：父页用 postMessage 向已加载的 iframe 发送加密后的登录态（如 JWT 或服务端签发的一次性 token），由 iframe 内页面自行调用本地登录接口。

关键点：

iframe 必须先加载目标域下的一个中转页（如 /sso-login.html），该页与目标系统同源，可安全调用其登录 API
父页不能直接 iframe.src = "https://b.com/login?u=xxx&p=xxx"，而应等 iframe 加载完成再 postMessage
目标系统需在中转页内监听 message 事件，并验证 event.origin 是否为白名单域名（如 https://a.com）
服务端签发的 token 应带短时效（如 60 秒）、绑定父页 origin 和随机 nonce，防止截获复用

为什么 postMessage 后 iframe.contentWindow 可能为 null

常见于 iframe 尚未完成加载就尝试访问 contentWindow，尤其跨域时浏览器会限制对未就绪 iframe 的访问。错误现象是控制台报 Blocked a frame with origin "https://a.com" from accessing a cross-origin frame 或直接 Cannot read property 'postMessage' of null。

正确做法：

监听 iframe 的 load 事件，而不是用 setTimeout 硬等（2000ms 不可靠）
确保 iframe.src 指向的是目标域下真实可访问的 HTML 页面（如 https://b.com/sso-login.html），而非跳转型 URL 或 404 资源
避免在 iframe 加载前就调用 postMessage；可在 load 回调里执行，或使用 iframe.addEventListener('load', ...)
如果目标页做了 document.domain 修改（仅限同主域子域），需父子页同时设置，否则仍视为跨域

localstorage.html 中如何安全接收并写入 token

这个中转页（常命名为 localstorage.html）的作用是：接收父页发来的登录信息，校验后存入 localStorage 或 sessionStorage，并触发自身页面跳转或通知主应用。它必须部署在目标系统域名下（如 https://b.com/localstorage.html），才能绕过同源策略写入本域存储。

HTML Extract

使用 MinerU 从 HTML 页面和文件中提取内容，将 HTML 转换为保持标题、列表、表格及文本层次结构的干净、结构化 Markdown。F...

下载

实操要点：

必须检查 event.origin，只接受来自可信父域的消息：if (event.origin !== 'https://a.com') return;
不直接存 event.data.token，而是用 crypto.subtle.digest() 或服务端返回的 signature 做二次校验（防篡改）
写入 localStorage 后，建议立即 window.location.replace('/') 或跳转到业务首页，避免中转页长期停留
不要在该页中暴露任何敏感逻辑（如解密私钥、打印 token 到 console），上线前务必移除调试代码