Skip to content

webrepl: Allow the page to run from the device (over HTTP). - #8931

Merged
dpgeorge merged 1 commit into
micropython:masterfrom
jimmo:webrepl-on-device
Jul 23, 2022
Merged

dpgeorge merged 1 commit into
micropython:masterfrom
jimmo:webrepl-on-device

Conversation

@jimmo

@jimmo jimmo commented Jul 20, 2022

Copy link
Copy Markdown
Member

This is an attempt to solve the issue where the publicly-hosted webrepl on https://micropython.org/webrepl is currently non-functional due to the page being served via https, but attempting to connect to a device hosting a non-secure websocket. See #5266

The main details of this change are in the corresponding webrepl client PR -- micropython/webrepl#70

This PR contains:

  • Removes unused client_handshake from websocket_helper, and then merges the remainder of this file (server_handshake) into webrepl.py (to reduce firmware size).
  • Adds the respond-as-HTTP handling to server_handshake to serve up the <base><script> page.
  • Allow the static host to be configured in webrepl_cfg.py (Consider making this part of webrepl_setup flow?)

For testing I've set the default host to https://gitcdn.link/cdn/jimmo/webrepl/webrepl-on-device/ to point to the files from the PR but this should be https://micropython.org/webrepl/ once deployed.

@dpgeorge

Copy link
Copy Markdown
Member

This looks really good.

Just thinking through the before and after:

Prior requirements and workflow:

  • a client with a browser
  • a device (eg esp32) running the webrepl server
  • client needs internet access, to load https://micropython.org/webrepl
  • client also has network access to the device
  • flow: client loads weprepl page in browser, enters device ws:// address, webrepl starts

New requirements and workflow:

  • a client with a browser
  • a device (eg esp32) running the webrepl server and skeleton HTML page
  • client needs internet access, to load javascript from https://micropython.org/webrepl
  • client also has network access to the device
  • flow: client loads webrepl page, gets HTML skeleton, fetches javascript from https://micropython.org/webrepl, accesses ws://, webrepl starts

So there's really no change in the requirements. It's just that you have to load a bit of HTML from the device first. Arguably this is cleaner because you now browse to the device in your browser, instead of browsing somewhere else then having to enter the address of your device.

The case where the client loads the webrepl page from a local file (or local server) will still work, because the device still acts as a ws:// server.

The only thing I can think of where it won't work anymore is if you preload https://micropython.org/webrepl in your browser, then change networks to the network with the device (eg connect to its AP) and connect to it. But that doesn't currently work anyway because of the HTTPS/WSS issue. The way to get this working would be to just load the webrepl page from a local file/local HTTP server.

@dpgeorge

Copy link
Copy Markdown
Member

I merged the corresponding change in the webrepl repo, but I can't get this PR working. Trying on both PYBD-SF2 and esp8266, the browser is able to load the webrepl page/terminal, but then clicking "Connect" it just prints "Disconnected" in the terminal and does nothing else.

@jimmo

jimmo commented Jul 22, 2022

Copy link
Copy Markdown
Member Author

I merged the corresponding change in the webrepl repo, but I can't get this PR working. Trying on both PYBD-SF2 and esp8266, the browser is able to load the webrepl page/terminal, but then clicking "Connect" it just prints "Disconnected" in the terminal and does nothing else.

I see the problem (you're using Firefox, but it's my bug). Will update this PR soon.

@jimmo
jimmo force-pushed the webrepl-on-device branch from d13cf4c to bf7795b Compare July 22, 2022 23:29
@jimmo

jimmo commented Jul 22, 2022

Copy link
Copy Markdown
Member Author

Fixed for Firefox.

Also updated the default startup message to say:

WebREPL server started on http://192.168.1.103:8266/

instead of

WebREPL daemon started on ws://192.168.1.103:8266

so the link can be directly opened.

@dpgeorge

Copy link
Copy Markdown
Member

Thanks, that does now work.

But there's still a small problem: using webrepl.start_foreground(password="mp") and then browsing to the given HTTP address, the device stops serving after the webrepl client page is loaded. So you need to run the start_foreground() function again before you can click the "Connect" button.

@jimmo
jimmo force-pushed the webrepl-on-device branch from bf7795b to e72155a Compare July 23, 2022 02:35
@jimmo

jimmo commented Jul 23, 2022

Copy link
Copy Markdown
Member Author

But there's still a small problem: using webrepl.start_foreground(password="mp") and then browsing to the given HTTP address, the device stops serving after the webrepl client page is loaded. So you need to run the start_foreground() function again before you can click the "Connect" button.

Fixed. Now runs the server until we get a successful websocket connection.

@jimmo
jimmo force-pushed the webrepl-on-device branch from e72155a to 194a165 Compare July 23, 2022 02:36
The device will respond to a non-WS request with a simple page that loads
websocket_content.js from a static host (http or https). However, even
if the resources are https, the page is still http and therefore allows
requesting to a WS (not WSS) websocket on the device.

Removed unused client_handshake from websocket_helper, and then merges the
remainder of this file (server_handshake) into webrepl.py (to reduce
firmware size). Also added the respond-as-HTTP handling to
server_handshake.

The default HTTP response is a simple page that sets the base URL and then
loads webrepl_content.js which document.write's the actual HTML.

Signed-off-by: Jim Mussared <[email protected]>
@jimmo
jimmo force-pushed the webrepl-on-device branch from 194a165 to 924e55a Compare July 23, 2022 02:43
@dpgeorge
dpgeorge merged commit 924e55a into micropython:master Jul 23, 2022
@dpgeorge

Copy link
Copy Markdown
Member

I tested it with PYBD-SF2 + Firefox and it works.

Thank you!

@villeneuve villeneuve mentioned this pull request Jul 26, 2022
tannewt pushed a commit to tannewt/circuitpython that referenced this pull request Feb 16, 2024
Add M5Stack Dial development board
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

extmod Relates to extmod/ directory in source

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants