有一部分人也遇到了类似的困扰：双击打开本地HTML文件，结果页面一片空白，样式全丢了，脚本也不执行，控制台还报了个“Not allowed to load local resource”。

第一反应通常是“代码哪儿写错了？”

但别着急，这事儿大概率不是你的锅——问题的根源，在于Firefox对file://协议施加了比Chrome更严格的同源限制。

同目录下的CSS、JS、JSON、图片等子资源，统统被浏览器拦截了。

这是一种保护机制，但对本地开发来说，确实让人头疼。

所以，排查方向要明确：

• 先确认是不是被拦截
• 再修正路径格式
• 或者直接上本地HTTP服务一劳永逸

确认文件是否真被Firefox拒绝加载

要确认问题的根源，有一个很简单但必须做的检查动作：

把HTML文件直接拖进一个已经打开的Firefox窗口（注意，不是双击），然后按F12打开开发者工具，切换到Network面板，再刷新页面。

如果看到大量红色403或灰色disabled的条目，而且类型是css、js、json或img，那就说明确实是file://协议的拦截在起作用。

但如果连HTML主文档都显示“无法加载”，那就得检查路径或配置了。

这一步非常关键，不然接下来所有的尝试都是在蒙眼走路。

修正file://协议路径格式（Windows用户必看）

双击打开失败，有相当一部分原因出在路径格式上。

Firefox对file://协议的斜杠数量、盘符冒号位置极其敏感。

正确的写法是：file:///C:/your/project/index.html——记住三个斜杠、盘符大写、冒号、正斜杠，少一个或多了反斜杠都可能出问题。

绝对不能写成file://C:pathindex.html或者file:///C:pathindex.html。

反斜杠在URL里会被解析成转义符，单个或两个斜杠会被当作相对路径忽略掉，结果就是Firefox静默失败，连错误提示都不给。

更需要注意的是，如果路径中带了中文或空格，必须做URL编码，比如测试.html要写成%E6%B5%8B%E8%AF%95.html，不然地址栏显示乱码，文件也打不开。

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

如果上面两步都确认过了，问题依然没解决，那可以考虑使用更可靠的方案。

方案一：用Python起一个本地HTTP服务（推荐，兼容所有Firefox版本）

操作起来其实很简单：

• 打开终端（Windows PowerShell、macOS Terminal或Linux Shell）
• 用cd命令切换到HTML文件所在的文件夹
• 输入python3 -m http.server 8000回车

Python 3.7以上版本自带这个模块，不需要额外安装。

之后在浏览器地址栏访问http://localhost:8000/index.html，这时候所有相对路径引用（比如./style.css、fetch('./data.json')）都能正常工作。

而且不需要修改任何代码或浏览器设置。

方案二：修改Firefox配置放开本地文件访问（仅限开发调试）

如果你觉得起服务太麻烦，也可以直接修改Firefox的配置。

步骤如下：

• 在地址栏输入about:config，回车后点击“接受风险并继续”
• 在搜索框中输入security.fileuri.strict_origin_policy
• 找到后双击，把布尔值由true改为false

这一步做完后，必须关闭所有Firefox窗口（包括任务栏后台进程），彻底重启浏览器，再双击HTML文件才会生效。

需要注意的是，这个方法只建议在开发调试时使用，生产环境中务必改回默认值。

检查HTML内引用的本地资源是否写对了

还有一个容易踩的坑：HTML里引用本地资源的写法。

比如这种写法，在Firefox里完全无效。

必须写成，注意三个斜杠、盘符小写、正斜杠。

相对路径引用如