如何在 Electron 中挂钩来自 javascript 的文件请求以生成正确的路径？

Question

我正在创建一个 Electron 应用程序，并在此过程中尝试使用一些现有的 javascript 和其他文件（css 和其他资源）。我的代码分布在多个包中，每个包都包含各种这些文件。在 Electron 之外，这些文件将由服务器提供，该服务器提供从文件的平面列表到每个文件的路径的映射，我正在尝试在 Electron 的“后端”中实现类似的“服务器端”功能，如果有这样的事情。由于 Electron 从协议中获取这些文件，file://因此它找不到其中的大部分文件，因为所有内容都相对于当前 javascript 文件的路径进行解析，并且这些文件彼此不了解，因此无法指定硬编码路径。Electron 中是否有某种机制来挂钩文件请求，以便我可以提供它查看的路径？在我的服务器端代码中，我做了一些事情，我有一个对象将文件名映射到它们所在的路径，我觉得解决方案同样是拦截请求并告诉 Electron 在何处查找每个文件。我发现了这个问题，但那里提供的解决方案对我不起作用，因为我的网络应用程序有点过于动态，并且请求来自代码深处，而不是我可以捕获的某些用户界面元素。

Answer 1

您可以通过拦截文件协议处理程序来完成此操作。如果您已将文件映射设置为如下对象：

files = {

    "file1.js": "/path/to/file1.js",

    "file2.js": "/path/to/file2.js",

    // etc.

}

然后在 createWindow 函数中，您将在实例化新的 BrowserWindow 后立即插入此代码：

protocol.interceptFileProtocol("file", (req, cb) => {

    var file = req.url.split("/")

    file = file[file.length-1]

    if (files[file]) {

        console.log(`intercepting ${file} => ${files[file]}`)

        cb({path:files[file]})

    }

})

注意：您从需要电子中获得的protocol参考资料const，例如：

const {app, BrowserWindow, protocol} = require("electron")

此代码假定文件名是唯一的，并且是路径中唯一重要的部分。因此，例如，无论代码认为“file1.js”位于什么路径，在上面的示例中它将被重定向到/path/to/file1.js. 如果请求的文件不存在，则行为未定义，可能不会加载任何内容。