HTTPS Request to AWS Elastic Beanstalk returns net::ERR_CERT_COMMON_NAME_INVALID

Question

Context

Domain set up:

I have a domain name registered with Porkbun, my-site.com.
I configured a DNS server with CloudFlare.
I have an SSL certificate from AWS Certificate Manager for my-site.com, www.my-site.com, and api.my-site.com.
I placed each CNAME record of the SSL certificate (for my-site.com, www.my-site.com, and api.my-site.com) into my DNS configuration.

With this set-up, my-site.com is trying to send an HTTPS POST request to my Flask application, which is my application's API, hosted on AWS Elastic Beanstalk.

Elastic Beanstalk set up:

I added inbound rules to my EB environment's EC2 security group:
- HTTP requests on port 80 and 0.0.0.0/0
- HTTPS requests on port 443 and 0.0.0.0/0.
I added listeners to the classic load balancer of my EB environment:
- Listener #1) Protocol: HTTP, Port: 80, Instance Protocol: HTTP, Instance Port: 80.
- Listener #2) Protocol: HTTPS, Port: 443, Instance Protocol: HTTP, Instance Port: 80, SSL Certificate: The one I created using ACM.
The environment's URL: my-site-env.xxx-xxxxxx.us-west-1.elasticbeanstalk.com/.

What I Am Trying To Do

On my-site.com, I am trying to send an HTTPS POST request to my API route: my-site-env.xxx-xxxxxx.us-west-1.elasticbeanstalk.com/api/register

const config = {
  headers: {
    'Content-Type': 'application/json',
  },
};

const body = JSON.stringify({ username, email, password });

const res = await axios.post(
  'https://my-site-env.x-xxxxxx.us-west-1.elasticbeanstalk.com/api/register',
  body,
  config
);

Problem

When my-site.com tries to execute the POST request, I receive this error:

POST https://reddalerts-env.eba-my6f6vhk.us-west-1.elasticbeanstalk.com/api/register 
net::ERR_CERT_COMMON_NAME_INVALID

I believe I configured Elastic Beanstalk's incoming traffic rules, as well as listeners to receive an HTTPS request. Am I missing a configuration for my DNS settings?

user_248823 · Answer

If you setup your own domain on your EB platform with SSL, you can only use your domain now (unless your force exceptions and allow insecure connections). The reason is that your SSL cert will be valid only for the domain(s) for which it has been registered.

This means that if you use https to connect to your website on EB, you can only use your domain. Default EB domain will result in the error you get, as your SSL cert does not cover the EB default domain.

As a side note, you can't register a valid SSL cert of the EB default domain, because the domain belongs to AWS, and AWS would have to do it. To register a valid SSL cert, you must own or manage the domain for which you want the cert.

user_10426919 · Answer

Thank you @Marcin for clearing my misconceptions up. I will put what I did to solve my problem concretely on top of his answer.

Even though the request is coming from my domain my-site.com, which is registered with my SSL certificate, my HTTP/HTTPS request is making a request to xxx-xxxxxx.us-west-1.elasticbeanstalk.com.

Since I configured my EB environment to listen with the SSL certificate, it can only accept requests from domains registered with my SSL certificate. As a result, my HTTP/HTTPS request to xxx-xxxxxx.us-west-1.elasticbeanstalk.com will not work. Since my EB environment will only accept requests from a domain registered with my SSL certificate, we must use the DNS server and a CNAME record.

To achieve this, I created a CNAME record within my DNS server that takes requests to api.my-site.com (which is in my SSL certificate), and redirects the request to my Elastic Beanstalk environment, xxx-xxxxxx.us-west-1.elasticbeanstalk.com.

Then my HTTP/HTTPS requests are made to api.my-site.com, as opposed to xxx-xxxxxx.us-west-1.elasticbeanstalk.com, e.g.:

const res = await axios.post(
  'https://api.reddalerts.com/api/login',
  body,
  config
);

Now that the HTTP/HTTPS request is made to a domain registered with the SSL certificate used by my EB environment, it completes successfully.