Azure Front Door custom domain not using correct cert

Question

I'm trying to setup a Storage account (static hosted app) with Azure Front Door, and while the routing to my static app is working, for some reason the certificate being used still points to the *.azuredge.net (as opposed to *.mydomain.com)

For the most part of a day I was fighting an issue where the domain would have a "succeeded" provision state, but then it'd revert back to "failed". After lot's googling (note this isn't really my area of expertise) it appeared the issue was due to my certificate not including Cloudflare's root cert. After re-creating the cert, I was finally able to provision the custom domain correctly, and the routing starting working fine. However, the site is still using the original edge certificate (the one the default endpoint would use) and therefore the browser flags it as insecure.

The summary of it is

1. I purchased a domain via Cloudflare
2. I provisioned an Azure Front Door Service (Standard)
3. As part of the AFD provisioning, an endpoint got created with the default route and routing group which points to a storage account static hosting url. That AFD endpoint url looks like myapp-xxxxxcmdmd4.z01.azurefd.net. As expected, if navigate to it, it all works as expected
4. I created an origin cert using Cloudflare and uploaded it to the key vault (for both wildcard subdomain and domain, so *.mydomain.com & domain.com)
5. Added a CNAME (wildcard) to point to the endpoint
6. Created a custom wildcard domain, and linked it to the uploaded cert. Note - I used the "Non-Azure validated domain" and "All other DNS services" options.
7. I added a TXT DNS record to the domain so it could validated
8. The provisioning of the domain was successful, and the routing works. I can navigate to https://testing.mydomain.com and the app renders fine, however the SSL issue is still there.

Here's a couple of pics below. Any help would be greatly appreciated

Answer 1

If the certificate is giving insecure error try the below workarounds:

In Azure front door -> front door designer -> your custom domain,

You can get a manage certificate to issue to this address and enable custom domain HTTPS

In the certificate management type select Front door managed and save it takes some time to apply generate the cerfication process

When azure front door is presented we get HTTP access to the front door and you can do SSL offloading once the manage certificate configuration it will access the site in HTTPS with secure connection

You need to take a TLS/SSL certificate in order to enable the HTTPS protocol for securely delivering content on a Front Door custom domain. You have the option to use a certificate that Azure Front Door manages or your own certificate.

Note: Apex/root domains, such as contoso.com, are not supported for enabling HTTPS via Front Door managed certificate. For this scenario, you can use your own certificate. If you use your own certificate, you must establish a complete certificate chain with allowed certificate authority (CA) on the Microsoft Trusted CA List .your request will be denied If you use a non-allowed CA the requests that involve that certificate aren't guaranteed to work as expected.

Reference:

Tutorial: Configure HTTPS on a custom domain for Azure Front Door (classic) | Microsoft Learn