search

brunch / auto-reload-brunch

Adds automatic browser reloading support to brunch.
88 stars 30 forks source link

using auto-reload with nginx and docker #74

Open jmls opened 7 years ago

jmls commented 7 years ago

our setup is slightly odd (!) in that we are using a dynamic nginx setup with docker, so that when a docker container spins up, it registers a domain with nginx and secures it with https from let's encrypt

so, I spin up my container foo, and run a node process on port 3000. In the background, foo.myapp.io is registered, and nginx listens for a https connection on port 443, and forwards the connection to the foo docker container on port 3000

However, there is a problem in that we can only use standard ports (80 / 443) in order to get round some firewall issues. We get round this by generating another domain wss-foo.myapp.io and mapping that request to the internal port 9485

All's well and good at this point - npm start fires up, and I can indeed access the server

However, the problems start with auto-reload

1) internally, within the docker container, the brunch process is running http, byt nginx is running https. This means that the auto-reload websocket server starts on plain http, and the injected client code tries to use ws:// which then causes problems with https and an insecure ws call

this can be fixed by adding an extra option to the auto-reload config, and using wss if this option is set

2) The second problem is slightly harder : the injected client uses the server name that is started (ie foo.myapp.ip, where I actually need it to use wss-foo.myapp.io

I was looking at the code in auto-reload-brunch, and in the vendor folder, there is the auto-reload.js client code. This code is where it uses the server.

I was interested to see this line of code

var ar = br['auto-reload'] = (br['auto-reload'] || {});

does that mean that there is a way of getting some config data from the server to the client ? If so, then I can add another extra option to the config, a wss hostname

So, at the end of a very long issue : the real question is,

Is it possible to get the auto-reload.js client file to use options from the server ?

thanks.

paulmillr commented 7 years ago
  1. create vendor/autoreload-config.js
  2. add window.brunch = {"auto-reload": {host: "wss-foo.myapp.io", port: "{your port}"}} to the file.
  3. In brunch config files: {javascripts: {order: {before: ['vendor/autoreload-config.js']}}}

That should load the script before others with your server configuration.