502 errors are occurring when connected with HTTPS, and 504 errors are occurring when connected with HTTP.
Below is the overall situation.
The cloud front has an Elastic Load Balancer and a front-end s3 bucket as the origin. I first created a cloud front with the s3 front-end bucket as the source, and later connected the load balancer as the source. The default behavior for the URL on the cloud front is '/api/*' to indicate the load balancer when accessed, and other front-end s3 buckets are set to access.
The settings related to the load balancer of the cloud front are as follows.
The settings for the origin are
- HTTPS only
- TLSv1.2
And the setting for the action is
- Redirect HTTP to HTTPS
- HTTP : GET, HEAD, OPTIONS, PUT, POST, PATCH, DELETE
- Viewer access restrictions: No
- Cache Policy: Caching Disabled
- Original Request Policy: AllViewerAndCloudFrontHeaders-2022-06
- Response Header Policy: CORSWithPreflight
And the settings for the load balancer are as follows.
- HTTPS:443 (target group: 80 ports on EC2 backend)
- Inbound rule: 443 port for "pl-22a6434b"
I configured the axios request to be sent to the URL on the backend when I accessed the front end, but there is an issue that the outgoing IP is set to local IP, so I'm setting it up to forward the request via the cloud front. Because I thought if it's set up like that, I should allow access to the load balancer for all inbound IPs.
So I changed the URL value of the request from the URL of the backend to the root domain of the cloud front, and implemented to send the request to the load balancer when it is followed by 'api/'. I've confirmed that it goes differently to the frontend/load balancer, but I'm not able to read the data on the backend properly from the frontend due to a 502 error.
- How can I solve this problem?
- The SSL/TLS certificate (mydomain.com , www.mydomain.com ) in the cloud front and the SSL/TLS certificate (api.mydomain.com ) I set in the load balancer are different. Could this be a problem?
I've been agonizing over this problem all day yesterday, but it's solved right away. Thank you.