Search code examples
expresscookiesaws-lambdaaws-api-gatewayamazon-cloudfront

API GW Lambda proxy integration CORS issue

Trying to send cookie back after login request on my hobby project website. For some reason it is working when running locally i.e. http://localhost:3000. But as soon as I push my API online and try to access it through my live website, I see no cookie under Application -> Cookies -> website (using chrome). I have googled a lot and I believe I have set check off every CORS policy.

The nodeJS is running in AWS lambda and is invoked through API gateway. API GW is directed to through a cloudfront distribution (if it matters).

In my express backend I have logged my headers accordingly:

res.cookie('jwt', token, cookieOptions);
console.log('Checking cookie', res);
console.log('Checking cookie', res.cookies);

res.status(statusCode).json({
  status: 'success',
  data: {
    user
  }
});

The output of this is partially this:

'access-control-allow-origin': [ 'Access-Control-Allow-Origin', 'https://example.com' ],
 vary: [ 'Vary', 'Origin' ],
 'access-control-allow-credentials': [ 'Access-Control-Allow-Credentials', 'true' ],
 'access-control-allow-methods':
  [ 'Access-Control-Allow-Methods',
    'GET, POST, PUT, PATCH, DELETE, HEAD, OPTIONS' ],
 'access-control-allow-headers':
  [ 'Access-Control-Allow-Headers',
    'Origin, X-Requested-With, Content-Type, Accept, X-PINGOTHER' ],
 'x-ratelimit-limit': [ 'X-RateLimit-Limit', 100 ],
 'x-ratelimit-remaining': [ 'X-RateLimit-Remaining', 97 ],
 date: [ 'Date', 'Fri, 11 Dec 2020 23:20:28 GMT' ],
 'x-ratelimit-reset': [ 'X-RateLimit-Reset', 1607732145 ],
 quizappuserloggedin: [ 'QuizAppUserLoggedIn', 'false' ],
 'set-cookie':
  [ 'Set-Cookie', 'my-cookie'; Path=/; Expires=Sat, 12 Dec 2020 23:20:34 GMT; HttpOnly; Secure'

From what I can tell I have set my CORS settings correctly. From my frontend I have set:

axios.defaults.withCredentials = true;

From what I can tell I have done everything I can find in Set cookies for cross origin requests

Meaning I have doubled checked my cors settings and from the print statement it looks like the cookie is being sent. But why is the browser not picking it up?

Could post the actual site and github repo if it helps, I have been stuck here for a whole now.

UPDATE

I looked at the response headers in my browser and compared it against the headers in the backend api. From that comparison I can see that my "set-cookie" header isn't included in the response even though I can clearly see that it is included in the response from the backend:

enter image description here

UPDATE 2

I believe after further investigation that I have narrowed it down to being an CORS issue with AWS API Gateway. I looked into these, but still no luck.

How to add CORS header to AWS API Gateway response with lambda proxy integration activate

Amazon API gateway ignores set-cookie

Logs from the lambda cloudwatch right before the response is being sent by the express framework as well as cloudwatch logs from the API Gateway (response headers).

API GW cloudwatch logs of the response headers:

API GW

Lambda cloudwatch logs of the response object sent by express framework:

LAMBDA

Solution

  • Turns out it wasn’t a CORS issue. I had simply forgotten to forward cookies from my cloudfront distribution.