data路径必须是同源可访问url，非同源、file://、空值或非法路径均被浏览器静默忽略；pdf渲染需data、type="application/pdf"及服务端content-type三者严格匹配，且跨域需cors支持。
data路径必须是可访问的同源URL，不能是file://或空值
浏览器只在object>首次插入DOM时读取data属性，且仅当它是一个合法、可解析、同源的URL才会发起请求。填data=""、data=" "、data="javascript:void(0)"或data="file://local/doc.pdf"，浏览器直接静默忽略——不报错、不请求、不显示fallback。
常见错误包括：
- 开发时用VS Code Live Server打开HTML，却写
data="docs/report.pdf"但实际PDF在./assets/docs/report.pdf，路径错导致404 - 本地双击HTML文件（
file://协议），哪怕PDF在同一目录，现代Chrome/Firefox也会拒绝加载，控制台无提示 - 部署后Nginx/Apache没配静态路由，比如请求
/pdfs/a.pdf返回404而非真实文件
相对路径要以HTML文档URL为基准，不是以JS执行位置为准
data的解析完全取决于当前HTML页面的URL，和JS在哪里运行无关。比如页面地址是https://example.com/app/dashboard.html，那么data="report.pdf"会请求https://example.com/app/report.pdf；而data="./docs/report.pdf"才对应https://example.com/app/docs/report.pdf。
构建工具（如Vite、Webpack）可能重写资源路径，需确认输出后data值是否仍指向正确位置：
- 若PDF被打包进
assets/目录，且HTML中写data="assets/report.pdf"，要确保构建产物里该路径真实存在 - 使用
public/目录存放PDF时，应写data="/report.pdf"（注意开头的/），否则可能被解析成子路径 - 服务端启用了HTML5 History模式（如React Router），但未配置fallback，会导致
data="chart.svg"被当成路由请求而返回index.html
跨域PDF必须配CORS，否则渲染失败且无明确错误
用data="https://cdn.example.com/file.pdf"时，即使HTTP响应是200，如果响应头缺失Access-Control-Allow-Origin，Chrome会拦截渲染——PDF区域空白，控制台只有一条模糊的Blocked loading resource from cross-origin URL，不提示具体原因。
解决方式只有服务端配合：
- CND或对象存储（如S3、OSS）需显式开启CORS，并允许
*或指定域名 - 反向代理（如Nginx）添加
add_header 'Access-Control-Allow-Origin' '*'; - 不推荐前端绕过：改
type、加crossorigin属性对<object></object>无效，它不支持该属性
PDF场景下data和type必须严格匹配，且type不能省略
PDF是目前<object></object>唯一稳定支持的内嵌类型，但三者缺一不可：data指向PDF文件、type="application/pdf"、服务端响应头也必须是Content-Type: application/pdf。任一不满足，浏览器就跳过内嵌，直接触发fallback。
典型陷阱：
-
type="pdf"或type="text/pdf"→ 触发fallback，不是警告，是直接放弃处理 - 服务端用
Content-Type: application/octet-stream返回PDF → Chrome下载文件，Firefox可能空白，都不渲染 - 遗漏
type属性 → 某些旧版Edge或禁用PDF查看器的环境无法识别，fallback概率大幅上升 - PDF本身损坏（如头信息缺失）→ 浏览器加载完成但白屏，控制台无错误，只能靠服务端校验文件完整性
data、type、响应头）全部对齐——漏掉任何一环，用户看到的都只是空白或下载弹窗。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
