AWS Elastic load balance and CORS issues

credit

In one of my projects, I’m getting issues while connecting to AWS load balancers - I have written this post to secure my studies in this regard.

We have an Angular 4 front end hosted on AWS S3 bucket, with an AWS elastic load balancer behind which we have multiple EC2 servers each running a pm2 service behind an nginx proxy.

The REST requests from the front end reaches the server without CORS issues:

• without the AWS elastic load balancer and directly to the EC2 server

The REST requests breaks with the CORS errors from the front end and not reaches the server:

• with the AWS elastic load balancer and not directly to the EC2 server

Although we’re not yet successful but these are the stuff (as per @agentspacecake) which we have tried so far:

1. Allowed CORS in the S3 bucket, example config — done
2. Allowed CORS in the back end using CORS node module — done
3. Allowed CORS in the nginx proxy using the CORS headers — done
4. Allow CORS on the load balancer’s front — not done

Based on my studies so far:

• Per @Max@AWS, we need to whitelist the “Origin” header
• Per @Brian@AWS, we’d want to whitelist the “Origin” and any other headers you’d like to forward
• This was a bug in the past especially for chrome
• As per @Arun@AWS, the requests needs to contain the headers which are expected to return
• Not sure if the browser caching could surface the CORS issue
• Per @hescar, we can also try adding a ‘Origin’ header
• Looks like, we shall not use * wildcard
• The AWS staff says that ELB doesn’t support CORS yet
• The feature request to ELB CORS support still looks open
• The docs says that the JSON Content-Type is not allowed in simple/actual requests

Requests only use the GET or POST HTTP methods. If the POST method is used, then Content-Type can only be one of the following: application/x-www-form-urlencoded, multipart/form-data, or text/plain.

Hope this helps to some extent.