BrowserSync proxy to two backend ports

Question

Using gulp I have:

browserSync.init({
  proxy: "localhost:8080",
  open: false
});

this allows me to go to http://localhost:3000 and the request goes to the backend on port 8080.

Now my app is split into two backends, so I have part of my app on port 8080 and the other part on port 1212

how can I tell browsersync to proxy http://localhost:3000/module1 to port 1212 and anything else http://localhost:3000/* to port 8080 ?

Thanks

score 1 · Accepted Answer · edited May 23 '17 at 11:52

based on this answer I was able to make a small change and fixed this issue using:

  var url = require('url');
  var proxy = require('proxy-middleware');
  var proxyOptions = url.parse('http://localhost:1212/api');
  proxyOptions.route = '/api';
  browserSync.init({
    proxy: {
        target: "localhost:8080",
        middleware: proxy(proxyOptions)
    },
    open: false
  });

this means that all requests going to http://localhost:3000 (default browsersync port) are proxied to 8080, but if any path of the request starts with /api, then it goes to http://localhost:1212/api

BrowserSync proxy to two backend ports

1 Answers1