Origin in request header is missing when using proxy in nextjs

Viewed 23

Techs used: FE(Next JS) BE(NodeJS/ExpressJS) My problem is when I use proxy in NextJs with axios, I setup a proxy and then no "Origin" header becomes missing.

Backend config, I've setting up cors to handle preflight requests:

const corsOptions = {
    credentials: true,
    methods: ['PUT', 'POST', 'GET', 'DELETE', 'OPTIONS'],
    allowedHeaders: [
        'token', 'Origin', 'X-Requested-With', 'Content-Type', 'Accept', 'Authorization',
    ],
   origin: (origin, cb) => {
    logger.info(`origin ${origin}`); // Here the origin doesn't return
    cb(null, true);
    return;
   },
};

Axios Config in FE:

const local = axios.create({
  baseURL: "/",
  headers: {
    "Content-Type": "application/json",
    'Access-Control-Allow-Origin': '*',
    'Access-Control-Allow-Methods': 'GET,PUT,POST,DELETE,PATCH,OPTIONS',

  },
  credentials: "same-origin",
  withCredentials: true,
});

When calling the API:

 return axiosInstance.local.get('/v1/users/profile');

the results return request headers with no Origin.

What is expected is to return the origin in the request headers.

if I changed the request instead of using instance to:

 return await axios.get('http://localhost:3005/v1/users/profile');

Specifying the host "http://localhost:3005" which is our backend server, it will return the origin in the request headers.

if I didn't specify the host like this:

 return await axios.get('/v1/users/profile');

It will proxy it to host of FE and call backend but no origin in the request headers.

0 Answers
Related