iframe.onerror不可靠，因其仅响应同域js错误或资源解析失败，对404/500、跨域、200空响应等均静默忽略；可靠方案是8秒超时后检测contentdocument.body.children.length是否为0或readystate是否非complete。
iframe.onerror 为什么不能用来显示备用内容
因为浏览器根本不会在 iframe 加载 404/500/空白页时触发 onerror。它只对同域 JS 抛错或资源解析失败（比如 src 指向一个不存在的 .js 文件）响应；对跨域、HTTP 错误、200 + 空 body 这些常见失败场景，一律静默忽略。写 onerror="showFallback()" 基本等于没写。
怎么可靠判断 iframe 真的加载失败了
核心是「超时 + 主动探活」：等一段时间后检查 iframe 是否有真实可读的内容。
- 设置统一超时（建议
8000ms），超时即视为失败 - 检测前确保 iframe 已插入 DOM 且已赋值
src - 优先读
iframe.contentDocument，fallback 到iframe.contentWindow?.document（Safari 下前者可能为null） - 两个条件任一成立即判定失败：
!doc || !doc.body || doc.body.children.length === 0，或doc.readyState !== 'complete' - 对跨域 iframe，
contentDocument和contentWindow会被置为null，此时直接走 fallback
备用内容区域该放什么、怎么触发重试
纯文字提示 + 隐藏 iframe 的方案体验差，用户无操作路径。fallback 必须带明确出口。
- fallback 区域至少包含一个按钮，文案如「重试加载」或「查看原始报告」
- 点击重试时，不能只写
iframe.src = iframe.src—— 浏览器可能缓存旧响应；要加防缓存参数：iframe.src = iframe.src.split('?')[0] + '?t=' + Date.now() - 重试前必须清除旧定时器（
clearTimeout(timerId)），再启动新一轮检测 - fallback 内容本身也依赖网络（比如远程图标或文案）？务必用
data:image/png;base64,...内联兜底，否则 fallback 可能也白屏
最易被忽略的边界点
不是“有没有 fallback”，而是 fallback 后是否还能 fallback —— 比如备用图也挂了、重试三次都失败、服务端返回的是 200 状态但 HTML 里只有 <h1>Service Unavailable</h1>。这些情况无法靠 readyState 或 children.length 捕获，得结合服务端约定（如响应 body 包含特定 class 或 meta）或上报监控做兜底决策。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
