Webpack-dev-server: Can webpack-dev-server set Host header when proxy to backend?

[linvar]

proxy config:
proxy: { "/api/": { "target": "http://www.b.com/" } }

from www.b.com server access log, the $host is localhost(develop enviroment)
but www.b.com server expected that the $host should be www.b.com.

Can webpack-dev-server set Host header when proxy to backend?
thanks

[SpaceK33z]

See the options in https://github.com/chimurai/http-proxy-middleware. Closing since this is a question.

[ActionScripted]

Since this is the top result for "webpack dev server proxy headers", here's the solution:

module.exports = {
  // ... other webpack settings
  devServer: {
    proxy: {
      '**': {
        target: 'http://some-host.test:1234',
        headers: {
          'X-Forwarded-For': '1.2.3.4'
        }
      }
    }
  }
};

Here we're proxying everything to some-host.text on port 1234 and sending along the X-Forwarded-For header with 1.2.3.4.

You have to set headers for each proxy object, so if you have several proxy objects to deal with you might create a headers constant and use that with each proxy object:

const proxy_headers = {
  'X-Forwarded-For': '1.2.3.4',
  'X-Another-Header': 'Hello'
};

module.exports = {
  // ... other webpack settings
  devServer: {
    proxy: {
      'api1/': {
        target: 'http://some-host1.test:1234',
        headers: proxy_headers
      },
      'api2/': {
        target: 'http://some-host2.test:5678',
        headers: proxy_headers
      }
    }
  }
};

[svogal]

For me it worked with Host header, like this:

target: 'http://some-host.test:1234',
headers: {
  'Host': 'some-host.test'
}    

[viknes-interana]

Not sure in which version it was introduced but dev-server version 3.2 and above:

target: 'http://some-host.test:1234',
changeOrigin: true,