移动端禁用 标签嵌 PDF 或网页，因其在 iOS Safari、微信、QQ 等浏览器中不可控：fallback 不渲染、onload 无效、contentDocument 为空或报错；应改用 实现稳定加载与降级。

别在移动端用 标签嵌 PDF 或网页——它在 iOS Safari、微信、QQ 浏览器里基本不可控，fallback 不触发、加载状态无法监听、内容无法访问，不是配置问题，是浏览器策略层面的放弃。

为什么 在移动端根本跑不起来

现代移动端浏览器（尤其是 iOS 15+ 和主流安卓 WebView）对 type="application/pdf" 或 type="text/html" 的 处理逻辑已转向“交由系统处理”或静默降级。你写的

请下载

子节点几乎从不渲染；onload 事件在 DOM 插入时就触发，和 PDF 是否渲染完成无关；contentDocument 在所有主流浏览器中返回 null 或抛 SecurityError。

• iOS Safari：强制唤起系统 PDF 阅读器，或直接空白
• 微信内置浏览器：忽略 data 中的中文参数（如 report.pdf?name=张三），请求发不出，也不报错
• 安卓部分 WebView：把 当作下载链接，连 fallback 文字都不显示

是更稳的替代方案

绕过了 MIME 类型协商和插件流程，Chrome、Edge、Firefox、Safari（iOS 15+）都把它当作第一顺位渲染路径。它默认支持手势缩放、能配 allow="fullscreen"、加载失败时可通过 onerror 或检查 iframe.contentWindow 是否为 null 做降级。

Convert Markdown To HTML And PDF - Markdown和HTML、PDF互转

实现 Markdown↔ HTML 互转，支持导出 PDF，用于用户请求的文档格式转换。

下载

• PDF 场景：直接写 ，不用 type 属性
• 跨域 HTML 嵌套： 支持 sandbox 和 referrerpolicy，比 权限控制更明确
• 移动端 fallback：可监听 iframe 的 onerror，再动态插入提示文案或下载按钮

真要兼容老系统，得靠 JS 主动探测 + 降级

不能依赖 自带的 fallback 渲染逻辑。必须用 JS 检测加载结果，并主动干预：

• 检查 object.offsetHeight === 0 或 object.getClientRects().length === 0 判断是否渲染失败
• 监听 error 事件（虽然它在 PDF 加载失败时也常不触发，但比等 load 可靠）
• 对 iOS 设备 UA 做白名单拦截，直接跳过 ，改用 或服务端直出 PDF 链接
• PDF 参数如 #page=3 在 data 中写进 URL 后，需额外用 JS 在 iframe 加载后调 postMessage 通知内部 viewer（如果用 pdf.js）

最易被忽略的一点：即使你坚持用 ，也必须确保 viewport meta 标签完整且硬编码在 里——width=device-width, initial-scale=1.0 缺一不可。否则 容器本身就会因视口错乱而高度塌陷，连 fallback 都没机会展示。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！