如何无需用户交互打开Chrome扩展目录内的二进制文件

Chrome扩展本身支持直接读取打包在安装包内的任意文件，不需要用户触发input交互，也无需从CDN拉取资源，50MB大小的文件完全兼容该方案，具体实现步骤如下：

步骤1：配置资源访问权限 #

首先需要在扩展的manifest.json中声明允许访问的二进制文件路径，不同版本的manifest配置略有差异：

• Manifest V3配置示例：

{
  "manifest_version": 3,
  // 其余扩展基础配置省略
  "web_accessible_resources": [
    {
      "resources": ["your_binary_path/*.bin"], // 替换为实际二进制文件的路径匹配规则
      "matches": ["<all_urls>"] // 可根据实际使用场景缩小匹配范围，提升安全性
    }
  ]
}

• Manifest V2配置示例：

{
  "manifest_version": 2,
  // 其余扩展基础配置省略
  "web_accessible_resources": ["your_binary_path/*.bin"]
}

步骤2：代码读取二进制文件 #

在扩展的任意执行上下文（background脚本、content script、popup页面脚本均可）中，通过chrome.runtime.getURL获取文件的扩展内部协议路径，直接用fetch读取即可：

// 替换为实际二进制文件在扩展包内的相对路径
const fileRelativePath = "assets/large_data.bin";
const targetFileUrl = chrome.runtime.getURL(fileRelativePath);

fetch(targetFileUrl)
  // 按需求选择读取格式，二进制内容推荐用arrayBuffer，需要文件对象的话用blob()
  .then(res => res.arrayBuffer())
  .then(fileBuffer => {
    // 此处即可正常处理读取到的二进制内容
    console.log("文件读取完成，大小为：", fileBuffer.byteLength / 1024 / 1024, "MB");
  })
  .catch(err => console.error("文件读取失败：", err));

注意事项 #

• 确保二进制文件在打包时被完整包含在扩展安装包内，填写的相对路径和web_accessible_resources的匹配规则完全对应
• 该方案没有文件大小限制，只要扩展打包后的总大小符合Chrome网上应用店的上传要求即可（当前Chrome网上应用店允许的扩展包最大为1GB，50MB完全符合要求）
• 读取过程不会触发跨域限制，也不需要额外申请其他扩展权限

内容的提问来源于stack exchange，提问作者jeribeb