Gulp browser-sync - redirect API request via proxy

Question

I\'m trying to redirect my API requests like this with gulp and browser-sync:

gulp.task(\'browser-sync\', function () {

   var files = [
      \'../index.ht         


        

Answer 1

I ran into the same issue with the gulp + browser-sync + proxy-middleware setup, while migrating from grunt to gulp.

Error: connect ECONNREFUSED
    at errnoException (net.js:904:11)
    at Object.afterConnect [as oncomplete] (net.js:895:19)

In my case something within the corporate network which didn't allow proxy-middleware to work. As soon I was on the public network, the issue was gone.

With grunt-connect + grunt-connect-proxy I could proxy files within the corporate network without any problems.

proxy-middleware implements its own proxy functionality, while grunt-connect-proxy uses http-proxy to do the actual proxy work.

I ended up writing a small middleware wrapper around http-proxy to be used in browser-sync and connect, which solved the proxy issues in the corporate network.

https://www.npmjs.com/package/http-proxy-middleware

var browserSync = require('browser-sync');
var proxyMiddleware = require('http-proxy-middleware');

var proxy = proxyMiddleware('/ajax', {target: 'http://cdnjs.cloudflare.com'});

browserSync({
    server: {
        baseDir: "./",
        port: 3000,
        middleware: [proxy]
    }
});