object的data属性必须为http(s)、data: uri或同源相对路径，禁止file://；type属性必填且须精确匹配mime类型；空data行为不一致，应避免；https页禁用http资源，需升级协议或改用data uri。
data属性必须是绝对或相对URL，不能是本地文件路径
浏览器出于安全限制，object 的 data 属性不接受 file:// 协议或未经协议的本地路径（比如 ./pdf/report.pdf 在某些环境会失败）。它只支持 HTTP(S)、data: URI 或同源相对路径（如 report.pdf）。
常见错误现象：Failed to load resource: net::ERR_FILE_NOT_FOUND 或空白区域无内容，往往就是 data 值写成了 C:\xxx\file.pdf 或 file:///xxx。
- ✅ 正确写法（同目录 PDF）：
<object data="report.pdf" type="application/pdf"></object> - ✅ 正确写法（HTTP 资源）：
<object data="https://example.com/chart.svg" type="image/svg+xml"></object> - ❌ 错误写法：
data="C:/projects/report.pdf"、data="file:///home/user/doc.pdf"
type属性不是可选的，必须匹配实际资源 MIME 类型
省略 type 或填错会导致浏览器无法正确解析嵌入内容——PDF 可能下载而非内嵌，SVG 可能渲染为乱码，Flash（已淘汰）直接失效。
关键点：浏览器靠 type 决定用哪个插件/渲染器，不是靠文件扩展名。
- PDF 文件 → 必须写
type="application/pdf" - SVG 文件 → 必须写
type="image/svg+xml" - SWF（已弃用）→
type="application/x-shockwave-flash"（现代浏览器基本不支持） - HTML 片段 →
type="text/html"（但注意同源限制，跨域 HTML 会触发 CORS 错误）
data值为空字符串或非法URL时，浏览器行为不一致
Chrome 会显示 fallback 内容（object 标签内的文本或子元素），Firefox 可能报错并留白，Safari 有时静默忽略。这不是 bug，而是规范未强制定义空 data 的行为。
实操建议：不要依赖空 data 触发 fallback；若需条件加载，用 JS 动态设置 data 属性更可靠。
- 避免：
<object data="" type="application/pdf">请启用 PDF 插件</object> - 推荐：
<object id="pdf-viewer" type="application/pdf">加载中…</object>，再用 JS 设置document.getElementById('pdf-viewer').data = 'report.pdf'
HTTPS 页面嵌入 HTTP 资源会触发混合内容阻断
现代浏览器默认阻止 HTTPS 页面通过 object 加载 HTTP 的 data，控制台报错 Mixed Content: The page was loaded over HTTPS, but requested an insecure object...，且对象不加载。
解决路径只有两条：要么把资源升级到 HTTPS，要么改用 data: URI（适合小文件，如图标 SVG）。
- 小 SVG 示例：
<object data="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='50' cy='50' r='40'/>%3C/svg>" type="image/svg+xml"></object> - 大文件（如 PDF）必须走 HTTPS，没有绕过方案
type 和协议一致性——看着标签写了，但 PDF 用 type="application/x-pdf" 或 URL 没加 https://，调试半天才发现是这两处卡住。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
