不允许加载本地资源-电子

Question

当我通过Visual Studio Code运行我的Electron应用程序时，将加载主进程，从而启动该index.html页面。在index.js脚本中，我将浏览器窗口重定向到名为的本地html文件startup.html，该文件位于我的脚本文件夹中，该文件夹只是应用程序的子文件夹。该index.html页面甚至无法启动，并且该应用程序生成以下错误消息：

不允许加载本地资源

在DevTools控制台中，它还显示了它正在尝试加载的资源：

file:///usr/local/lib/node_modules/electron/dist/Electron.app/Contents/Resources/default_app.asar/scripts/ui/startup/startup.html

如果我是npm start从项目的根文件夹运行的，则该应用程序将正确启动，并且index.html和.startup.html页面都将加载。

Visual Studio Code通过以下方式发射电子：

/usr/local/bin/electron

这似乎与用just启动它不同npm start。不知道有什么区别。

旁注：在我添加代码以启动之前startup.html，该应用程序将从Visual Studio Code运行。仅在添加startup.html之后，它才不起作用。

是什么原因造成的？

Answer 1

我有一个小的电子应用程序，它从 /app 子文件夹加载 main.js 和 main.htm。

main.js 加载正常，应用程序创建一个窗口： let mainWindow = null

app.on('ready', () => {
    console.log('Hello from Electron');
    mainWindow = new BrowserWindow();
})

然后我添加了代码来加载同样位于 /app 子文件夹中的 main.htm 文件。

mainWindow.webContents.loadFile("main.htm")

但是，我在 (chrome) 控制台中收到以下错误：

错误说，

“不允许加载本地资源：”

那是一条红鲱鱼。错误应该是“找不到本地资源”。

如果我展开路径，我终于看到它正在尝试从我的项目的根目录加载 main.htm 文件——即使 main.js 从 /app 子文件夹（这是 main.htm 文件所在的位置）运行成立）。

为了解决这个问题，我只需要将子文件夹添加到它被修复的路径中：

mainWindow.webContents.loadFile("app/main.htm")

发生此错误的原因很可能是您的文件路径不正确，而不是因为用户权限或其他原因。

如果添加这行代码，您将看到它认为 cwd 的路径（当前工作目录：

console.log(`${__dirname}`)

Answer 2

显然，Electron 的更新版本中发生了一些变化，破坏了 VS Code 配置设置。有关如何配置 VS Code 的文档已更新于：

https:// Electronjs.org/docs/tutorial/debugging-main-process-vscode