object 标签加载 PDF 必须同时满足协议（仅 HTTP/S）、同源、服务端 Content-Type 响应头为 application/pdf 三重约束，缺一不可；否则静默 fallback 或下载。
object 标签的 data 路径不是写对就能用，它必须同时满足协议、同源、服务端响应头三重约束，否则浏览器会静默 fallback 或直接下载。
data 属性必须是 HTTP(S) 协议下的可访问路径
本地双击 HTML 文件（file:// 协议）时，data="./report.pdf" 会被大多数现代浏览器拒绝加载，控制台报 Not allowed to load local resource。这不是路径写错，而是协议限制——object 的 PDF 渲染依赖内建 PDF Viewer，而该模块只在 HTTP(S) 上启用。
- 开发阶段务必用本地服务器启动（如
python3 -m http.server 8000），确保地址形如http://localhost:8000/page.html - 相对路径（
./docs/a.pdf、docs/a.pdf）仅在同源前提下有效；绝对路径（/docs/a.pdf）从根目录解析，更稳定 - 跨域 PDF 必须带 CORS 头，且
data值不能是 data URL（data:application/pdf;base64,...在部分 Safari 版本中不触发渲染）
type="application/pdf" 不是可选项，是强制校验开关
写成 type="pdf"、type="text/pdf" 或干脆留空，都会导致 Chrome/Firefox 跳过内建 PDF Viewer，直接尝试调用插件（已失效）或触发 fallback。加上 typemustmatch 属性后，浏览器还会比对服务端返回的 Content-Type 响应头，不一致就立即降级。
- 服务端必须返回
Content-Type: application/pdf；Nginx 示例配置：location ~ \.pdf$ { add_header Content-Type application/pdf; } - 若用 Node.js/Express，需显式设置：
res.set('Content-Type', 'application/pdf')，不能依赖sendFile()的自动推断（某些版本会返回application/octet-stream） - 测试是否生效：在浏览器开发者工具 Network 面板中点开 PDF 请求，看 Response Headers 里是否有正确的
Content-Type
fallback 内容只在明确失败时才显示，不是“没渲染就出来”
object 的内部内容（比如一段提示文字或下载链接）不会因为 PDF 加载慢、渲染卡顿、或用户滚动未到视口就提前展示。它只在以下情况触发：404、CORS 拒绝、type 与响应头不匹配、或协议被禁（file://）。这意味着你不能靠它做“加载中占位”，但可以放心当兜底。
立即学习“前端免费学习笔记（深入）”；
- fallback 文本建议包含可点击的
<a href="xxx.pdf" download>下载 PDF</a>，避免纯文字让用户无路可走 - 不要在
object里嵌套img或video做备用——它们自身可能加载失败，且无法被object的 fallback 机制捕获 - 若需弱网下更早感知失败，可在
object外层加onerror监听（注意：该事件只在data解析失败或 404 时触发，不覆盖 MIME 不匹配）
真正容易被忽略的是服务端响应头和协议环境——写对 data 和 type 只完成了三分之一，剩下两个条件缺一不可，且错误时往往没有明显报错，只有白屏或自动下载。
