type属性是object标签的强制要求,用于声明MIME类型;必须与data资源的实际Content-Type严格匹配,否则加载失败或渲染异常;子内容为真实降级路径,非装饰性文字。

object 标签的 type 属性必须显式声明
不写 type,浏览器就无法判断该加载什么插件或如何解析资源,多数现代浏览器会直接忽略或降级为 404。它不是可选的“提示”,而是强制要求的 MIME 类型标识。
常见错误是只写 data 路径却漏掉 type,结果页面空白、控制台无报错、调试半天才发现没类型声明。
-
type="application/pdf"对应 PDF 文件(需系统或浏览器支持 PDF 插件/内置查看器) -
type="image/svg+xml"是 SVG 的标准类型,比用img更利于交互和 DOM 操作 -
type="text/html"可嵌入 HTML 片段,但注意同源限制和 CSP 影响 -
type="application/x-shockwave-flash"已废弃,不要用;现代项目应彻底规避
type 和 data 的 MIME 类型必须严格匹配
浏览器不会自动推断类型——哪怕 data 指向一个 .png 文件,如果 type 写成 "image/jpeg",部分浏览器会拒绝加载或渲染异常。
验证方式很简单:用 curl 或浏览器开发者工具 Network 面板查看响应头中的 Content-Type,确保和 type 属性值完全一致(包括大小写和分号后参数,如 charset=utf-8 通常可省略)。
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面,使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力: - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面; - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”; - 提及位于 `apps/console/src/featur
立即学习“前端免费学习笔记(深入)”;
- 服务器返回
Content-Type: image/webp→type必须为"image/webp" - 本地文件通过
file://协议加载时,浏览器常 fallback 到text/plain,此时type声明几乎无效,应避免 - 动态生成的内容(如 Blob URL)需在创建时明确设置 type,否则
URL.createObjectURL(blob)产生的地址无法靠type属性“覆盖”
fallback 内容不是可有可无的补充
object 标签的子内容(即开始与结束标签之间的部分)是真正的降级路径,不是装饰性文字。当 type 不被支持、data 加载失败、或 MIME 类型不匹配时,这部分才会渲染。
很多人只放一句“无法显示”,其实可以放 iframe、img、甚至带 JS 初始化逻辑的 div,只要符合语义和可访问性要求。
- 对 PDF:可嵌套
<iframe src="doc.pdf"></iframe>作为备用(注意 iframe 的 sandbox 和同源) - 对 SVG:直接写内联 SVG 代码,保证图形始终可见
- 避免在 fallback 里再嵌套
object,容易形成无限 fallback 循环
type 属性不触发预检请求,但影响 CORS 行为
type 本身不改变网络请求逻辑,但浏览器根据它决定是否启用插件沙箱、是否允许跨域资源访问。例如:type="application/pdf" 加载跨域 PDF 时,若响应头缺失 Access-Control-Allow-Origin,即使 data URL 合法,也会被静默拦截(DevTools Network 中显示 canceled)。
- PDF/SVG/HTML 等类型都受 CORS 控制,不能仅靠
crossorigin属性绕过 - 使用
type="text/plain"加载文本资源时,浏览器可能拒绝执行脚本或解析 HTML,这是预期行为,不是 bug - 没有
type时,某些浏览器会尝试 sniff 内容类型,但结果不可控且已被主流引擎弱化支持
type 的同步更新——改了前端 type 值,却忘了调整后端接口的 Content-Type 响应头。


















