Object URL 管理：URL.createObjectURL 与 revokeObjectURL

---

title: Object URL 管理：URL.createObjectURL 与 revokeObjectURL

keywords:

• Object URL
• Blob URL
• createObjectURL
• revokeObjectURL
• 内存治理

description: 说明对象 URL 的创建与释放，用于本地预览与下载场景，避免内存泄漏与句柄积压，并与文件访问与媒体处理协作，提供示例与建议。

categories:

• 应用软件
• 系统工具

---

概述

URL.createObjectURL(blob) 创建临时的本地资源 URL，适用于文件预览与下载。必须在不再使用时 URL.revokeObjectURL(url) 释放，避免内存泄漏与句柄积压。

示例

const blob = new Blob([new Uint8Array([1,2,3])], { type: 'application/octet-stream' })
const url = URL.createObjectURL(blob)
const a = document.createElement('a'); a.href = url; a.download = 'data.bin'; a.click()
URL.revokeObjectURL(url)

工程建议

• 生命周期：在组件卸载或任务完成后统一释放；避免重复创建。
• 与文件访问：结合 File System Access/OPFS 管理持久化与预览；记录资源来源。
• 安全：校验内容类型与大小；避免不可信内容执行。

参考与验证

• MDN URL.createObjectURL 文档：https://developer.mozilla.org/docs/Web/API/URL/createObjectURL
• MDN URL.revokeObjectURL 文档：https://developer.mozilla.org/docs/Web/API/URL/revokeObjectURL