Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
[electron]Use electron as a Web Server
<!doctype html>
<html><head><script src="app.js"></script></head><body></body></html>
// utility
var console = {
log: function () {
var ipc = require('electron').ipcRenderer
var args = ["console"].concat([].slice.call(arguments));
return ipc.sendSync.apply(ipc, args)[0];
}
};
var quit = function () {
var ipc = require('electron').ipcRenderer
return ipc.sendSync("app", "quit")[0];
};
// server handler
window.addEventListener("load", function () {
var ipc = require('electron').ipcRenderer
ipc.on("request", function (event, req, port) {
var doc = document.implementation.createHTMLDocument(req.url);
var h1 = doc.createElement("h1");
h1.textContent = "Hello DOM: " + req.url;
doc.body.appendChild(h1);
ipc.send(port, 200, {"content-type": "text/html;charset=UTF-8"},
doc.documentElement.outerHTML);
});
}, false);
const {app, BrowserWindow} = require('electron')
// electron main
console.log(process.versions);
app.on("ready", function () {
var ipc = require('electron').ipcMain
ipc.on("console", function (ev) {
var args = [].slice.call(arguments, 1);
var r = console.log.apply(console, args);
ev.returnValue = [r];
});
ipc.on("app", function (ev, msg) {
var args = [].slice.call(arguments, 2);
ev.returnValue = [app[msg].apply(app, args)];
});
var window = new BrowserWindow({show: false});
window.loadURL("file://" + __dirname + "/app.html");
window.webContents.once("did-finish-load", function () {
var http = require("http");
var crypto = require("crypto");
var server = http.createServer(function (req, res) {
var port = crypto.randomBytes(16).toString("hex");
ipc.once(port, function (ev, status, head, body) {
res.writeHead(status, head);
res.end(body);
});
window.webContents.send("request", req, port);
});
server.listen(8000);
console.log("http://localhost:8000/");
});
});
@derekchiang

This comment has been minimized.

Copy link
Owner Author

derekchiang commented Dec 21, 2017

Run electron server.js (or run with xvfb-run as xvfb-run electron server.js on headless linux).

Now visit http://localhost:8000 and http://localhost:8000/foo/bar

@CyprusGrunumn

This comment has been minimized.

Copy link

CyprusGrunumn commented May 29, 2018

So Im relatively new to Electron and JS as a whole.

if im understanding this correctly, /foo/bar would be a directory on your webserver. so could i instead say

localhost:8000/index.html/

will that return a different web page?

@dirkk0

This comment has been minimized.

Copy link

dirkk0 commented Apr 5, 2019

No, it won't - the code above sends the same response to all requests.

If you only need a simple REST-like service, this code is enough:

const { app, BrowserWindow } = require('electron')
const PORT = 8080

// electron main
console.log(process.versions);

app.on("ready", function () {
  var mainWindow = new BrowserWindow({ show: true });
  mainWindow.loadURL("file://" + __static + "/app.html");
  mainWindow.webContents.openDevTools()
  mainWindow.webContents.once("did-finish-load", function () {
    var http = require("http");
    var server = http.createServer(function (req, res) {
      console.log(req.url)
      if (req.url == '/123') {
        res.end(`ah, you send 123.`);
      } else {
        const remoteAddress = res.socket.remoteAddress;
        const remotePort = res.socket.remotePort;
        res.end(`Your IP address is ${remoteAddress} and your source port is ${remotePort}.`);  
      }
    });
    server.listen(PORT);
    console.log("http://localhost:"+PORT);
  });
});

The contents of app.html could be anything.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.