电子js - serving html

Question

我正在尝试提供另一个html文件，以便浏览器可以从electronjs访问它。这是文件目录：

app folder:
- index.js // this is the init file for electron.
- index.html // main interface.
- ip.js // <-- included in index.html, codes for serving the static html to browser.
- package.json
-- node_modules
-- pad: // <-- this is the root folder I want to access via browser
    - index.html // <-- browser will get to see this page.
    - pad_index.js

index.js将拥有基本的electron js内容。'index.html‘将导入并运行ip.js，其中包含向浏览器提供./pad/index.html服务的代码。

ip.js:
var os = require("os");

const http = require("http");
var path = require("path");
var url = require("url");
var fs = require("fs");

const port = 3000;

var staticBasePath = "./pad/";

var staticServe = function(req, res) {
  var resolvedBase = path.resolve(staticBasePath);
  var safeSuffix = path.normalize(req.url).replace(/^(\.\.[\/\\])+/, "");
  var fileLoc = path.join(resolvedBase, safeSuffix);

  var stream = fs.createReadStream(fileLoc);

  stream.on("error", function(error) {
    res.writeHead(404, "Not Found");
    res.write("404: File Not Found!");
    res.end();
  });
  res.statusCode = 200;
  stream.pipe(res);
};

var httpServer = http.createServer(staticServe);

httpServer.listen(port,  () => {
  console.log(`Server running at http://${hostname}:${port}/`);
});

当我用electron .测试它时，一切都正常。我可以转到browser并输入http://localhost:3000/index.html，它将显示来自./pad/index.html的内容。

但是，在我使用electron builder构建应用程序，然后运行构建的应用程序后，我在浏览器中获得了404: file not found!。我确信我错过了一些非常重要的东西，但不确定是什么。

我该如何解决这个问题？

Answer 1

根据电子生成器配置，您必须更改directories部分，以允许您的文件与应用程序打包在一起。

查看位于：https://www.electron.build/configuration/configuration#configuration的directions部分

这个答案可能对Electron index.html not loading after building the app很有帮助