BrowserSync proxy on a remote server with Gulp?

Question

I have a remote Linux server on which I run the Node.js application, which is proxied through nginx at http://www.example.com .

I have gulp (for compiling SASS) installed with BrowserSync. Whenever I run gulp on the server, the access urls look something like this:

 [BS] Access URLs: ---------------------------------- Local: http://localhost:3000 External: http://10.0.2.15:3000 ---------------------------------- UI: http://localhost:3001 UI External: http://10.0.2.15:3001 ---------------------------------- 

So this will not work because I am not trying to access the server through localhost. I need to access it with the actual URL: http://www.example.com . When I browse http://www.example.com , I see on the page that BrowserSync is not being entered on the page.

I was messing around with the BrowserSync proxy options, but they are not clear. I tried the following in my gulp task:

 browserSync.init({ proxy: { target: 'http://www.example.com:4000' } }); 

And then I get the following:

 [BS] Proxying: http://www.example.dev:4000 [BS] Access URLs: ---------------------------------- Local: http://localhost:3000 External: http://10.0.2.15:3000 ---------------------------------- UI: http://localhost:3001 UI External: http://10.0.2.15:3001 ---------------------------------- 

But port 4000 is not open on the firewall, so this will not work. Is this the right way to do this and I just need to open this port? Why not work with port 80? Or am I sure of that?

Answer 1

Try this generator:

https://www.npmjs.com/package/generator-angular-proxy

He does exactly what you want ...