如图，在代码里，我们请求了public文件夹下的img.json文件，这在浏览器环境下是没问题的。

错误：

  但是当我们使用 

npm run electron:build

打包运行之后，发现控制台报错

Fetch API cannot load app://./img.json. URL scheme "app" is not supported.

错误原因：

这是由于 Electron 不支持 fetch 方法使用 app:// 协议，导致在使用 fetch 方法读取本地文件时出错。

解决方法：

在background.js的这个位置

加上  supportFetchAPI: true, 添加后的代码如下

protocol.registerSchemesAsPrivileged([
  {
    scheme: "app",
    privileges: { secure: false, standard: true, supportFetchAPI: true },
  },
]);

代码解释:

protocol.registerSchemesAsPrivileged() 是 Electron 中用来注册自定义协议的方法。在该方法中传入一个包含了 scheme 和 privileges 的对象，其中：

• scheme（必选）：自定义协议名，例如 "app"、"file" 等等。

• privileges（可选）：指定该自定义协议的权限。具体包括：

  • secure：Boolean 类型，指定是否启用安全限制。默认值为 false。

  • standard：Boolean 类型，指定是否符合标准规范。默认值为 true。

  • supportFetchAPI：Boolean 类型，指定是否支持使用 Fetch API（即 window.fetch() 方法）进行网络请求。默认值为 false。