expose Mira via localtunnel / ngrok

stefano delle monache's icon

Hello,
I'm trying to expose a simple max patch (bangs and message boxes) via mira outside the local network.
I'm aware of portforwarding issues (e.g., https://youtu.be/NUbr4IPSDz4), I've been trying the 07-tunneling example in the Xebra.js package, and I could successfully expose the max patch via virtual network such as ZeroTier, although the last solution requires that all the clients sign in the network.

Instead, I need to provide the user with a direct URL. My current attempts are the following:

  • Using localtunnel: lt -p 8086 -s webinterface -o
    I open a tunnel to mira on port 8086 and open the browser at URL https://webinterface.localtunnel.me
    The connection page to miraweb is correctly displayed, yet when I try to connect, I have the following errors

  • Mixed Content: The page at 'https://webinterface.loca.lt/' was loaded over HTTPS, but attempted to connect to the insecure WebSocket endpoint 'ws://webinterface.loca.lt:8086/'. This request has been blocked; this endpoint must be available over WSS.

  • Uncaught DOMException: Failed to construct 'WebSocket': An insecure WebSocket connection may not be initiated from a page loaded over HTTPS.

localtunnel returns an HTTPS address, so I tried using ngrok for http only

  • Using ngrok: ngrok http 8086
    ngrok returns both http and https links. I open the http link, the mira connection page is correctly displayed, yet the connection times out

  • WebSocket connection to 'ws://a166affc8f13.ngrok.io:8086/' failed: Error in connection establishment: net::ERR_CONNECTION_TIMED_OUT

I think there might be different issues at stake (first, I'm not an expert I must say), and I cannot figure out any workaround at the moment.
Any help / hint / comment is really appreciated.
Best,
Stefano


Sebastian Adams's icon

Hi Stefano, I know your post is old but I am having similar issues both with the exact code from this tutorial and also a patch/client code of my own. I can't find any similar threads

Did you ever solve this problem?

If not - maybe somebody else knows how to make a WSS connection with Xebra.js?

I don;t have the option of running HTTP because I am trying to use accelerometer data, which will be blocked unless the client page is secured. So the mixed content message seems inevitable unless Xebra can deal with a secured websocket.

Julien Vincenot's icon

Anyone got some success with this issue?

I'm very bad with network topics so even when I get to solve similar issues couple years ago (using paid ngrok with custom url exposing a subdomain of my private website with dedicated SSL certificate) I forgot everything I learned.

Is there some known recipe allowing to expose Mira via a public url?

I'm trying to display screenshots of my Mac's screen updated frequently so the audience can watch the generative score of a piece (bach etc.) during a live performance. Seems overkill but less heavy than streaming a video.

Oh also, to add some fun I'm living in China so with audience here I'd be looking for a solution that would NOT require a VPN… 😅