http-proxy-middleware，如何复制所有/cookie 标头

Question

I am using lite server by John Papa with HTTP proxy middleware by chimurai as a dev server. the problem is with my session cookie, I cannot persist the session cookie that comes from the real server. I saw this solution: https://github.com/chimurai/http-proxy-middleware/issues/78

but I see no resemblance to my bs-config.js:

var proxy = require('http-proxy-middleware');

module.exports = {
    port: 3003,
    server: {
        middleware: {
            1: proxy('demo/webservice/jaxrs', {
                target: 'https://localhost:8443',
                secure: false, // disable SSL verification
                changeOrigin: true   // for vhosted sites, changes host header to match to target's host
            }),
            2: require('connect-history-api-fallback')({index: '/index.html', verbose: true})
        }
    }
};

Does someone knows how to merge this two?

UPDATE: this is part of the response headers:

set-cookie:JSESSIONID=620083CD7AEB7A6CC5772AC800E673E3; Path=/appServer/webservice/jaxrs; Secure
strict-transport-security:max-age=31622400; includeSubDomains
Transfer-Encoding:chunked

UPDATE2: I think my config should look like this:

var proxy = require('http-proxy-middleware');

function relayRequestHeaders(proxyReq, req) {
    Object.keys(req.headers).forEach(function (key) {
        proxyReq.setHeader(key, req.headers[key]);
    });
};

function relayResponseHeaders(proxyRes, req, res) {
    Object.keys(proxyRes.headers).forEach(function (key) {
            res.append(key, proxyRes.headers[key]);
        });
};

module.exports = {
    port: 3003,
    server: {
        middleware: {
            1: proxy('/skybox', {
                target: 'https://localhost:8443',
                secure: false, // disable SSL verification
                changeOrigin: true,   // for vhosted sites, changes host header to match to target's host
                onProxyReq: relayRequestHeaders,
                onProxyRes: relayResponseHeaders
            }),
            2: require('connect-history-api-fallback')({index: '/index.html', verbose: true})
        }
    }
};

but now res.append is undefined :(

Answer 1

try it:

var cookie;
function relayRequestHeaders(proxyReq, req) {
  if (cookie) {
    proxyReq.setHeader('cookie', cookie);
  }
};

function relayResponseHeaders(proxyRes, req, res) {
  var proxyCookie = proxyRes.headers["set-cookie"];
  if (proxyCookie) {
    cookie = proxyCookie;
  }
};

It's working with lite-server

Answer 2

Not sure how your localhost:3003 is configured; With or without https: ...

Say you are using http://localhost:3000 (not https:); The Secure cookie attribute from your target might be the cause for your browser to omit the cookie.

4.1.2.5. The Secure Attribute

The Secure attribute limits the scope of the cookie to "secure"
channels (where "secure" is defined by the user agent). When a
cookie has the Secure attribute, the user agent will include the
cookie in an HTTP request only if the request is transmitted over a
secure channel (typically HTTP over Transport Layer Security (TLS)

source: https://tools.ietf.org/html/rfc6265#section-4.1.2.5

Browsers may omit cookies based on the algorithm described in: https://tools.ietf.org/html/rfc6265#section-5.4

Try removing the Secure Attribute and see if that helps

Answer 3

B.Ma's answer give me a hint to solve my problem with the webpack-dev-server which probably uses the http-proxy-middleware under the hood to proxy the request. The problem comes with the httpOnly cookies and this approach solved it. Here is my config that I used in the webpack.conf.js:

let myappSessionValidationCookie = '';

module.exports = {
    ...
    devServer: {
        publicPath: 'http://localhost:9000/',
        ...
        proxy: {
            '/api': {
                target: 'http://localhost/myapp',
                changeOrigin: true,
                onProxyReq: function (proxyReq) {
                    if (myappSessionValidationCookie) {
                        proxyReq.setHeader('cookie', myappSessionValidationCookie);
                    }
                },
                onProxyRes: function (proxyRes) {
                    const proxyCookie = proxyRes.headers['set-cookie'];
                    if (proxyCookie) {
                        myappSessionValidationCookie = proxyCookie;
                    }
                },
            },
        },
    },
});

Some explanation for the configuration. I have a backend that is serving the app's api under the localhost/myapp/api/* and sets a httpOnly cookie that is for authentication purposes. That header (set-cookie) was not transferred by the proxy to the new location (localhost:9000/myapp/api/*) so the browser is not keeping it and all following requests were without this cookie and failed. All the credits goes to B.Ma. Many thanks for the post!!!

Answer 4

In my case setting "cookieDomainRewrite": "localhost", works. This allows the browser to setup correctly the cookies since the domain would match

Below complete config for setupProxy.js in React:

const {createProxyMiddleware} = require('http-proxy-middleware');

module.exports = function (app) {
    app.use(
        '/api',
        createProxyMiddleware({
            target: 'http://localhost:8000',
            changeOrigin: true,
            cookieDomainRewrite: "localhost",
        })
    );
};

Answer 5

// Set up the proxy.
if (dev) {
  const { createProxyMiddleware } = require('http-proxy-middleware')
  server.use(
    '/api',
    createProxyMiddleware({
      target: 'https://api.example.com/',
      changeOrigin: true,
      cookieDomainRewrite: 'localhost',
      // logLevel: 'debug',
    })
  )
}

This is my configuration. I think the point is with

cookieDomainRewrite: 'localhost',