Get Cookie from axios response using cors on the server side

Question

I run Vue.js 2.5.2 and axios 0.17.1 against a Node.js server using express 4.16.2 and cors 2.8.4.

When I do a login

axios.post('/login', {"username": "a", "password": "b").then((response) => {
    console.log(response.headers['set-cookie']);
}

I get undefined as output. On other topics they told to set the Access-Control-Expose-Headers: Access-Token, Uid. I did this in my server-config like this:

const express = require('express'),
cookieParser = require('cookie-parser'),
cors = require('cors'),
bodyParser = require('body-parser'),
const server = express();

server.use(cookieParser());
server.use(bodyParser.json({limit: '50mb'}));
server.use(bodyParser.urlencoded({limit: '50mb', extended: true}));

server.use(cors({
  "origin": "*", 
  "credentials": true,
  "exposedHeaders": ["Uid", "Access-Token"]
  // same for "Uid, Access-Token"
  // Adding "set-cookie" to this list did not work.
}));

I can see in the Chrome Developer Toolbar, that Access-Control-Expose-Headers-Option is set in the OPTION-Request and the POST-Request. Also in the POST-Request I can see the set-cookie-header. But the log of response.headers['set-cookie'] is still undefined.

Edit:

This behavior is in the development-mode: Server is running on localhost:3000, client is running on localhost:8080.

When I build the vue.js-client for production mode so that both runs on localhost:3000, it works.

Any ideas?

Thank you!

You need to add the `set-cookie` to the `exposedHeaders` list, as that says what headers the client is allowed to access — Ferrybig, Feb 17 '18 at 23:14
Hi Ferrybig, no sadly this did not work. In the meantime I noticed something else... I edited my post — Rokko_11, Feb 18 '18 at 20:32
No, I removed everything about authentication out of my project and switched to keycloak. So I authenticate in my client against keycloak and get a token. Then I send the token along with my request to the server and the server checks this token against keycloak too. — Rokko_11, Jun 23 '18 at 11:19

score 4 · Answer 1 · answered Feb 20 '18 at 20:56

Access-Control-Allow-Credentials: true (which is what 'controls' whether cookies and other 'credentials' can be used in a CORS request) is not compatible with Access-Control-Allow-Origin: * - you need to specify the exact origin from which the request is coming in the ACAO response header if you want to use cookies.

Basically, extract the Origin request header and ensure that it is 'mirrored back' in the Access-Control-Allow-Origin response header. In your case, it will probably be https://localhost:8080, but you shouldn't hardcode it - always extract it from the Origin request header.

So the answer should be as simple as specifying the value of the Origin request header in the server.use.cors.origin value.

Get Cookie from axios response using cors on the server side

1 Answers1