Cors config doesn't seem to do anything

Serverless Framework
,
1

I’m trying to get cors properly setup in API Gateway via my serverless config. As far as I can tell, though, the configuration isn’t really doing anything. My function is set up like this:

plugins:
    - serverless-domain-manager

custom:
    customDomain:
        domainName: api.[my-domain].com
        basePath: ''
        certificateArn: <my-cert>
        stage: ${self:provider.stage}
        createRoute53Record: true

    functions:
    api:
        handler: ./dist/handler.handler
        events:
            - http:
                path: "{proxy+}"
                method: ANY
                cors:
                    - enabled: true
                    - origin: 'https ://app.[my-domain].com'
                    - methods: 'DELETE,GET,HEAD,OPTIONS,PATCH,POST,PUT'
                    - headers: 'Content-Type,X-Amz-Date,Authorization,X-Api-Key,X-Amz-Security-Token,My-Token'

FIrst of all, I’m not even sure of the proper format or which properties are actually supported. On the serverless website alone, there are 3 different ways of doing this:

  • https ://www.serverless.com/framework/docs/providers/aws/events/apigateway#enabling-cors
  • https ://www.serverless.com/blog/cors-api-gateway-survival-guide#how-do-i-handle-preflight-requests-with-serverless
  • https ://www.serverless.com/framework/docs/providers/spotinst/guide/cors/

None of them seem like official or definitive documentation for how this should work. Anyway, when I deploy to API Gateway and Lambda, it seems like those settings are completely ignored:

Screen Shot 2020-08-24 at 7.25.14 AM
Screen Shot 2020-08-24 at 7.25.14 AM2646×1146 281 KB

This is the auto generated OPTIONS method that is used for preflight requests, I guess. The ANY request doesn’t have any indication that it’s got CORS setup at all.

Nothing I do seems to get this setup properly so that I don’t get this error:

Access to XMLHttpRequest at ‘https ://api.[my-domain].com’ from origin ‘https ://app.[my-domain].com’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

My express server is passing the headers along as it is suppose to, but the API Gateway response is not passing them along.

2

Well, after 2 days, I’ve finally found that it wasn’t cors not working (though, I’m still curious why the API Gateway UI isn’t reflecting what’s in my serverless config). My lambda was timing out due to something unrelated, and causing an http error. This http error wasn’t carrying the required headers so the browser just reported error mentioned above.

In case it helps anyone, review your lambda logs. In my case, the lambda was set to a max execution time of 6 seconds, and so the logs always showed an Integration Latency of 6+ seconds.