谷歌浏览器无法读取本地磁盘上的HTML文件该如何授权

谷歌浏览器禁用file://协议下多数Web功能是因安全上下文缺失；可通过添加--allow-file-access-from-files参数临时启用（Chrome 117+已弃用），或启用chrome://flags/#file-system-access并手动授权，更可靠方案是使用Python、VS Code Live Server或Node.js serve启动本地HTTP服务。

谷歌浏览器无法读取本地磁盘上的HTML文件，是因为其默认禁止file://协议下执行多数现代Web功能，包括加载外部脚本、调用File System API、使用ES模块import等——这不是文件打不开，而是安全上下文缺失导致功能被静默禁用。

启用本地文件基础访问权限

第一步：右键桌面Chrome快捷方式→选择“属性”→在“目标”栏末尾添加一个空格，再粘贴：--allow-file-access-from-files。

第二步：点击“确定”保存，关闭所有Chrome进程（任务管理器中确认无chrome.exe残留），再双击该快捷方式启动。

第三步：拖拽HTML文件到新打开的浏览器窗口，或通过地址栏输入file:///C:/your/file.html访问。此参数仅对本次启动实例生效，不改变全局策略。

⚠️ 注意：该参数在Chrome 117+中已被弃用，部分API（如showOpenFilePicker）仍会失败，仅适用于简单静态页面快速预览。

为现代文件系统API授予权限

方法一：启用实验性开关并手动授权

在地址栏输入chrome://flags/#file-system-access → 回车 → 将“File System Access API”设为Enabled → 点击右下角“Relaunch”重启浏览器。

访问你的本地HTML页面（如file:///C:/project/index.html）→ 点击地址栏左侧锁形图标 → “站点设置” → 向下滚动找到“Local file system” → 设为Allow。

【必须先完成Flags启用，否则“Local file system”选项不会出现】

方法二：用开发者工具强制注入权限（仅调试用）

F12打开开发者工具 → 切换到Application面板 → 左侧选中“Permissions” → 在右侧空白处右键 → 选择“Add permission” → 输入fileSystem → 勾选“granted”。刷新页面后即可调用showDirectoryPicker()。

绕过file://限制的可靠方案

Python用户：打开HTML所在文件夹的终端，运行python -m http.server 8000 → 浏览器访问http://localhost:8000/your-page.html。

VS Code用户：安装Live Server插件 → 右键HTML文件 → “Open with Live Server” → 自动以http://127.0.0.1:5500起服务。

Node.js用户：全局安装serve（npm install -g serve），进入项目目录后运行serve -s . -p 8000。

这三者均使页面运行在Chrome认可的安全上下文内，所有HTML5 API、fetch、import、localStorage、File System Access均可正常使用。