如何在嵌入式Chromium中自动加载VS Code网页版并打开指定目录

首先明确核心限制：vscode.dev作为网页应用，受浏览器安全策略约束，无法自动访问本地文件系统——必须由用户手动触发授权，这是浏览器的原生安全机制，常规JS无法直接绕过。不过结合嵌入式Chromium的可控性，有几种不用深入源码的思路可以尝试：

1. 模拟用户触发授权（仅能唤起对话框，无法自动选目录） #

不用研究源码，通过开发者工具定位“打开文件夹”按钮的DOM选择器，注入JS模拟点击操作：

• 打开vscode.dev，按F12打开开发者工具，在Elements面板找到“打开文件夹”按钮，复制其选择器（比如可能是button[aria-label="打开文件夹"]）
• 在嵌入式Chromium的页面加载完成后，注入以下代码：

  // 模拟点击打开文件夹按钮
  document.querySelector('button[aria-label="打开文件夹"]').click();
  

但这只能唤起浏览器原生的文件选择对话框，JS无法自动填充或选择指定目录（浏览器禁止此类操作防止恶意网站窃取本地文件）。

2. 利用嵌入式Chromium的自定义权限/Node.js集成（可行的突破方向） #

如果你的嵌入式Chromium可以结合Node.js环境（类似Electron架构），可以绕过浏览器安全限制：

• 用Node.js的fs模块读取指定本地目录的内容
• 注入JS到vscode.dev页面，调用其内部的工作区API，将本地文件内容同步到网页版的虚拟工作区中
• 或者通过嵌入式Chromium的自定义扩展能力，预先对目标目录授予文件系统访问权限，再调用showDirectoryPicker()时自动返回该目录的句柄（部分定制化Chromium支持此类权限预配置）

3. 监听目录选中事件（用于后续逻辑联动） #

如果需要在用户手动选择目录后触发后续操作，可以重写浏览器的showDirectoryPicker方法来监听：

const originalPicker = window.showDirectoryPicker;
window.showDirectoryPicker = async () => {
  const dirHandle = await originalPicker();
  // 这里可以拿到选中的目录句柄，做后续逻辑处理
  console.log('用户选中的目录:', dirHandle);
  return dirHandle;
};

结论 #

不用深入vscode.dev源码的话，无法实现完全自动打开指定本地目录——因为浏览器安全限制无法绕过。但可以通过嵌入式Chromium的定制能力（结合Node.js、预配置权限）来间接实现需求，或者模拟用户操作唤起授权对话框，再配合监听事件完成后续逻辑。

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