无法从 Firefox Inspector 加载本地文件

如何解决无法从 Firefox Inspector 加载本地文件

我正在尝试在现有网站上预览新创建的图像。我希望能够在 Firefox 中打开开发人员工具 (Inspector) 并将背景图片的 url 编辑到我的本地文件中，以便快速预览它的外观。

当我将文件拖到 Firefox 上打开时，它会在地址栏中正常打开： file:///Users/ian/Desktop/format-BG.jpg

我将该文件路径复制到我的检查器中：background-image: url(file:///Users/ian/Desktop/format-BG.jpg); 但它没有加载。奇怪的是，当我点击检查器中的 URL 时，它会在一个新选项卡中打开“可卸载”图像在地址栏中具有完全相同的 URL 但没有加载。

这是安全功能还是什么？

MacOs 11.4 (20F71) Firefox 89.0（64 位）

解决方法

是的，这是一项安全功能。想象一下，浏览器会以这种方式加载本地文件。然后嵌入在页面中的 JavaScript 也可以访问该信息。

恶意网站以这种方式直接访问文件系统，无需任何用户交互。因此，所有浏览器都会阻止访问通过 file:// 方案引用的文件。

话虽如此，应该如何处理 file:// 方案的行为仍然没有标准化（参见 https://github.com/whatwg/html/issues/3099）。因此，不同的浏览器对通过 file:// 方案引用的本地文件的处理方式略有不同。

这里有一些链接供进一步阅读：

• https://textslashplain.com/2019/10/09/navigating-to-file-urls/
• https://security.stackexchange.com/questions/153706/why-local-links-are-disabled-by-default-in-modern-browsers
• https://security.stackexchange.com/questions/201208/why-do-browsers-disallow-accessing-files-from-local-file-system-even-if-the-html

不过，似乎有一种方法可以改变这种行为，https://superuser.com/a/1513162 中对此进行了描述。