Serve a Web IDE directly off your network-connected Espruino! #2703

gfwilliams · 2025-02-12T00:59:20Z

gfwilliams
Feb 12, 2025
Maintainer

Posted at 2018-03-21 by @gfwilliams

There are still a few kinks to iron out, but if you upload this code to your Espruino WiFi board:

var WIFI_NAME = "...";
var WIFI_PASS = "...";

function onPageRequest(req, res) {
  res.writeHead(200, {'Content-Type': 'text/html'});
  res.end(`<html>
<body style="margin:0px"> 
<iframe id="ideframe" src="https://www.espruino.com/ide/" style="width:100%;height:100%;border:0px;"></iframe>
<script src="https://www.espruino.com/ide/embed.js"></script>
<script>
  var ws = new WebSocket("ws://" + location.host + "/ws", "serial");
  var Espruino = EspruinoIDE(document.getElementById('ideframe'));
  Espruino.onports = function() {
    return [{path:'local', description:'Local Device', type : "net"}];
  };
  Espruino.onready = function(data) { Espruino.connect("local");};
  Espruino.onwrite = function(data) { ws.send(data); }
  ws.onmessage = function (event) { Espruino.received(event.data); };
  ws.onclose = function (event) { Espruino.disconnect(); };
</script>
</body>
</html>`);
}

/* Quick hack to ensure that on older builds,
process.env fits into available buffers */
if (process.env.EXPORTS) {
  process.env = process.env;
  delete process.env.EXPORTS;
}
/* Hack to ensure that `reset` won't cause us problems */
global.reset = function() {
  console.log("Ignoring reset() request");
};

var wifi = require("Wifi");
wifi.connect(WIFI_NAME, { password : WIFI_PASS }, function(err) {
  if (err) {
    console.log("Connection error: "+err);
    return;
  }
  console.log("Connected!");
  var server = require('ws').createServer(onPageRequest);
  server.listen(80);
  server.on("websocket", function(ws) {
    ws.on('message',function(msg) { LoopbackA.write(msg); });
    LoopbackA.on('data',function(msg) { ws.send(msg); }); 
    ws.on('close', function() { 
      LoopbackA.removeAllListeners();
      USB.setConsole(); 
    });
    LoopbackB.setConsole();
  });
  wifi.getIP(print);
});

Then you can connect to the displayed IP address and get a full Web IDE that you can upload code from!

Obviously if you reset() the board then the WiFi connection is lost and the IDE stops responding so that has been disabled (and also large print statements will be lost) but otherwise it's actually pretty usable. I'd recommend you use one of the latest Espruino firmwares though.

This should also work on other devices with pretty minimal changes (eg. USB->Serial1 on disconnect) - I'd be interested to hear how you get on.

espruino-discuss3 · 2025-02-12T00:59:22Z

espruino-discuss3
Feb 12, 2025
Maintainer

Posted at 2018-03-21 by Wilberforce

Looks great!

Is line 28 correct? It's assigning the var to itself?

On the esp8266 there is way of setting the hostname, so then you can use for example http://espruino.local - is there a way of doing this on this board - then you don't need to worry about the IP address..

0 replies

gfwilliams · 2025-02-12T00:59:25Z

gfwilliams
Feb 12, 2025
Maintainer Author

Posted at 2018-03-21 by @gfwilliams

Is line 28 correct? It's assigning the var to itself?

Yes - usually calling process.env creates the var on the fly, but assigning it to itself stops that, so you can then have control over what's in it. It's not needed on the newest builds - it's just to ensure the IDE can still get the board info fine on old builds.

Good point about the host name - yes, it should be pretty easy to call wifi.setHostname.

Also the IDE could also cope with disconnects a bit better (maybe with auto-reconnect) in which case you really could call reset - it'd just require a bit of a pause while the board reconnected to WiFi.

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Espruino JavaScript

Serve a Web IDE directly off your network-connected Espruino! #2703

{{title}}

Replies: 2 comments

{{title}}

{{title}}

Select a reply

Espruino JavaScript

Serve a Web IDE directly off your network-connected Espruino! #2703

gfwilliams Feb 12, 2025 Maintainer

Replies: 2 comments

espruino-discuss3 Feb 12, 2025 Maintainer

gfwilliams Feb 12, 2025 Maintainer Author

gfwilliams
Feb 12, 2025
Maintainer

espruino-discuss3
Feb 12, 2025
Maintainer

gfwilliams
Feb 12, 2025
Maintainer Author