0

I'm facing problems with getting set-cookies to work from node.js through a Vue frontend.

This is what the login method looks like in Vue:

login() {
  axios({
      method: 'post',
      url: 'http://localhost:3000/auth/login',
      data: {
        email: this.email,
        password: this.password,
      },
      withCredentials: true
    })
    .then(response => {
        const token = response.data.data.token;
        const decodedToken = Utils.checkToken(token);
        if (!decodedToken) {
          throw new Error('Something went wrong');
        }

        if (decodedToken) {
          this.$emit('loginSuccessful');
        }
      }
    }

Controller method in node.js:

res
  .cookie('my_cookie', token, {
    httpOnly: false,
    expires: new Date(Date.now() + 24 * 3600000),
    domain: process.env.COOKIE_DOMAIN,
    sameSite: 'none',
    secure: true
    })
  .status(200)
  .send();

Cors configuration:

  this.express.use(cors({ credentials: true, origin: 'http://localhost:8080' }));

It logs out the following error:

Access to XMLHttpRequest at 'http://localhost:3006/auth/login' from origin 'http://localhost:8080' has been blocked by CORS policy: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

Not sure where I'm messing up

Not sure if relevant, but i see that a preflight option request is sent first, where the headers seems to be correct

Access-Control-Allow-Origin: http://localhost:8080
Access-Control-Allow-Credentials: true
Access-Control-Allow-Methods: GET,HEAD,PUT,PATCH,POST,DELETE

However on the POST request the origin is set to *

Access-Control-Allow-Origin: *
Access-Control-Allow-Credentials: true
Jørgen Vik
  • 487
  • 4
  • 20

0 Answers0