Muokkaa

Jaa

Custom domains with Azure Static Web Apps

  • Artikkeli

By default, Azure Static Web Apps provides an autogenerated domain name for your website, but you can point a custom domain to your site. Free SSL/TLS certificates are automatically created for the autogenerated domain name and any custom domains you may add.

When you map a custom domain to a static web app, you have a few options available, which include configuring subdomains and an apex domain.

The following table includes links to articles that demonstrate how to configure a custom domain based provider type. 1

Action Using... Using...
Set up a domain with the www subdomain Azure DNS External provider
Set up an apex domain Azure DNS External provider

1 Some registrars like GoDaddy and Google don't support domain records that affect how you configure your apex domain. Consider using Azure DNS with these registrars to set up your apex domain.

Note

Adding a custom domain to a preview environment is not supported. Unicode domains, including Punycode domains and the xn-- prefix are also not supported.

About domains

Setting up an apex domain is a common scenario to configure once your domain name is set up. Creating an apex domain is achieved by configuring an ALIAS or ANAME record or through CNAME flattening. Some domain registrars like GoDaddy and Squarespace (formerly Google) don't support these DNS records. If your domain registrar doesn't support all the DNS records you need, consider using Azure DNS to configure your domain.

Alternatively, for domain registrars that don't support ALIAS records, ANAME records or CNAME flattening, you can configure an A record for your static web app. This configuration directs traffic to a single regional host of your static web app. Using A records isn't recommended as your application no longer benefits from global distribution, and this type of setup could affect application performance if your traffic is globally distributed.

Note

CNAME record maps a domain name to another domain (or subdomain) whereas A record maps a domain name to an IP address. If the IP address changes, a CNAME entry is still valid, unlike A record. Let’s say you have WebApp1 and you would like users to access it from https://www.contoso.com. You can do it in two possible ways: you can create a CNAME record and map it to WebApp1.azurestaticapps.net. Alternatively, you can create an A record and map it to the IP address of WebApp1.

The following are terms you might encounter as you set up a custom domain.

  • Apex or root domains: Given the domain www.example.com, the www prefix is known as the subdomain, while the remaining segment of example.com is referred to as the apex domain.

  • Domain registrar: A registrar verifies the availability of a domain sells the rights to purchase a domain name.

  • DNS zone: A Domain Name System (DNS) zone hosts the DNS records associated to a specific domain. There are various records available which direct traffic for different purposes. For example, the domain example.com may contain several DNS records. One record handles traffic for mail.example.com (for a mail server), and another www.example.com (for a website).

  • DNS hosting: A DNS host maintains DNS servers that resolve a domain name to a specific IP address.

  • Name server: A name server is responsible for storing the DNS records for a domain.

For custom domain verification to work with Static Web Apps, the DNS must be publicly resolvable. After the domain is added, one of the following conditions must be met for automatic certificate renewal to work:

  • Ensure that the public internet CNAME DNS record used to add the custom domain to the Static Web App via CNAME validation is still present. This option is only valid if CNAME validation was used to add the domain to the static web app.

  • Ensure that the custom domain resolves to the static web app over public internet. This option is valid regardless of the validation method used to add the domain to the web app. This approach is valid even when you enable private endpoints. The purpose of a private endpoint for Static Web Apps is to block internet access to the site contents, but not to block internet DNS resolution to the site.

Zero downtime migration

You may want to migrate a custom domain currently serving a production website to your static web app with zero downtime. DNS providers don't accept multiple records for the same name and host, so you can separately validate your ownership of the domain and route traffic to your web app.

  1. Open your static web app in the Azure portal.

  2. Add a TXT record for your custom domain (APEX or subdomain). Instead of entering the Host value as displayed, enter the Host in your DNS provider as follows:

    • For APEX domains, enter _dnsauth.www.<YOUR-DOMAIN.COM>.
    • For subdomains, enter _dnsauth.<SUBDOMAIN>.<YOUR-DOMAIN.COM>.

  3. Once your domain is validated, you can migrate your traffic to your static web app by updating your CNAME, ALIAS, or A record to point to your default host name

Next steps

Use the following links for steps on how to set up your domain based on your provider.