Change socket.io host/port that BrowserSync UI uses?

[Codelica]

Hello,

Excellent project. :) Just wanted to make sure I'm not overlooking something with the addition of the UI interface. I run local BrowserSync instances that are proxied (via NGINX) to keep my mind straight and the URLs I share w/ others nice and clean. All is fine there.

Now I'm hoping to proxy the UI interfaces as well, however the socket.io connection the UI portion uses seems to be intent on using the port it "knows" BrowserSync is using (e.g. 3000 by default) and the current hostname being browsed. Is there any reasonable way to override that host/port combo used by UI to feed it the name/port of my proxy being used?

Ultimately I'm just after having sets like the following via proxy:

http://sync.foo.com <- BrowserSync
http://sync-ui.foo.com < BrowserSync UI

I can obviously give up proxying things and just open up a bunch of direct ports for everything, but was just curious it there might be an option I'm overlooking.

Thanks!

[shakyShane]

Hi there!

This all sounds completely do-able - however it's one of those situations where I'd need to have that type of project/setup running locally so that I can plumb it all together and ensure things work...

As you may know, the UI is a very recent addition and configuration is currently limited to changing the port it uses via:

ui: {
    port: 4000
}

Just to clarify though, is this what you're looking for?

[Codelica]

Thanks for the reply! Yep, you got it.

I saw the port options after doing a browser-sync init. Just couldn't see a way to independently control what port UI attempts to use for its socket.io connection (other then what browersync is configured to use locally, which can't be 80 since nginx is bound)

In the end I'd just love to bring up...

sync.foo.com -> (proxy'd from localhost:3000)
sync-ui.foo.com -> (proxy'd from localhost:3001)
sync.bar.com -> (proxy'd from localhost:3002)
sync-ui.bar.com -> (proxy'd from localhost:3003)
...

My snag seems to just be in getting the UI portion to override its desire to use the local port assigned for browsersync. Or maybe I'm overlooking something else. :)

Thanks again...

-James

[davidwindell]

We're having this exact issue, we use a Kubernetes based web-based development environment which using Nginx to proxy all request through port 80. This means that the URLs for each of the ports become:

https://site-80.dev.ourdomain.com (routes requests to port 80)
https://site-3000.dev.ourdomain.com (routes request to port 3000)
https://site-3001.dev.ourdomain.com (routes request to port 3001)

However, this fails because browser-sync still tries to append port 3000 to requests as shown by errors in the UI console which tries to connect to:

https://site-3001.dev.ourdomain.com:3000/browser-sync/socket.io/

@Codelica I don't suppose you got anywhere with this all those years ago?

[Codelica]

@davidwindell sorry, I was never able to find a solution before moving on to other projects. :(

[davidwindell]

Thanks for replying, I appreciate it! We have found a workaround for our scenario, we run BS on port 443 inside the container and Nginx on port 80. This tricks everything into working but requires sudo.