Muokkaa

Jaa

Set up an apex domain in Azure Static Web Apps

  • Artikkeli

Domain names without a subdomain are known as apex or root domains. For example, the domain www.example.com is the www subdomain joined with the example.com apex domain.

Some domain registrars (like Google and GoDaddy) don't allow you to point the apex domain to an existing URL. If your registrar doesn't support ALIAS or ANAME records, or doesn't allow CNAME flattening, consider the following options:

  • Configure your domain with Azure DNS
  • Forward the apex domain to the www subdomain
  • Use an A record

Using an A record directs your traffic to a single regional host of your static web app. When enabled, your static web app no longer benefits from its global distribution, and this may affect your application performance. Consider using ALIAS, ANAME or CNAME record for APEX domains for the best performance.

This guide demonstrates three options for configuring an apex domain.

  • Use the steps to set up with an ALIAS record if your domain registrar supports the ALIAS DNS record.

    If your registrar doesn't support ALIAS records, but does support ANAME records or CNAME flattening, see their documentation for configuration settings.

  • Use the steps in forward to www subdomain if your domain registrar doesn't support the ALIAS DNS record.

  • Use the steps to set up with an A Record if the above options do not suit you. With an A record, your traffic is directed to a single Static Web Apps host, and your app no longer benefit from the performance improvements provided by global distribution.

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.

Set up with an ALIAS record

Before you create the ALIAS record, you first need to validate that you own the domain.

Validate ownership

  1. Open the Azure portal.

  2. Go to your static web app.

  3. From the Overview window, copy the generated URL of your site and set it aside in a text editor for future use.

  4. Under Settings, select Custom domains.

  5. Select + Add.

  6. In the Enter domain tab, enter your apex domain name.

    For instance, if your domain name is example.com, enter example.com into this box (without any subdomains).

  7. Select Next.

  8. In the Validate + Configure tab, enter the following values.

    Setting Value
    Domain name This value should match the domain name you entered in the previous step.
    Hostname record type Select TXT.

  9. Select Generate code.

    Wait as the code is generated. It make take a minute or so to complete.

  10. Once the TXT record value is generated, copy (next to the generated value) the code to the clipboard.

  11. Select Close.

  12. Open a new browser tab and sign in to your domain registrar account.

  13. Go to your domain name's DNS configuration settings.

  14. Add a new TXT record with the following values.

    Setting Value
    Type TXT
    Host Enter @
    Value Paste the generated code value you copied from the Azure portal.
    TTL (if applicable) Leave as default value.

  15. Save changes to your DNS record.

Set up an ALIAS record

  1. Return to your domain name's DNS configuration settings.

  2. Add a new ALIAS record with the following values.

    Setting Value
    Type ALIAS
    Host Enter @
    Value Paste the generated URL you copied from the Azure portal. Make sure to remove the https:// prefix from your URL.
    TTL (if applicable) Leave as default value.

  3. Save changes to your DNS record.

    Since DNS settings need to propagate, this process can take some time to complete.

  4. Open a new browser tab and go to your apex domain.

    After the DNS records are updated, you should see your static web app in the browser. Also, inspect the location to verify that your site is served securely using https.

Forward to www subdomain

Each domain registrar has a different process for managing domain names. Once you sign in to your account with your registrar, look for domain forwarding options. Some registrars have this functionality listed under DNS options, while others have them associated with Website options.

Make sure as you set up forwarding that you only configure the apex domain to forward to the www subdomain.

See your registrar's documentation for details.

Set up with an A record

Before you create the A record, you first need to validate that you own the domain.

Validate ownership

  1. Open the Azure portal.

  2. Go to your static web app.

  3. From the Overview window in the top right corner of the Essentials section, select JSON View.

  4. Copy the value of the stableInboundIP property and set it aside in a text editor for future use. This is the IP address of your regional Static Web Apps host.

  5. Under Settings, select Custom domains.

  6. Select + Add.

  7. In the Enter domain tab, enter your apex domain name.

    For instance, if your domain name is example.com, enter example.com into this box (without any subdomains).

  8. Select Next.

  9. In the Validate + Configure tab, enter the following values.

    Setting Value
    Domain name This value should match the domain name you entered in the previous step.
    Hostname record type Select TXT.

  10. Select Generate code.

    Wait as the code is generated. It make take a minute or so to complete.

  11. Once the TXT record value is generated, copy (next to the generated value) the code to the clipboard.

  12. Select Close.

  13. Open a new browser tab and sign in to your domain registrar account.

  14. Go to your domain name's DNS configuration settings.

  15. Add a new TXT record with the following values.

    Setting Value
    Type TXT
    Host Enter @
    Value Paste the generated code value you copied from the Azure portal.
    TTL (if applicable) Leave as default value.

  16. Save changes to your DNS record.

Set up an A record

  1. Return to your domain name's DNS configuration settings.

  2. Add a new A record with the following values.

    Setting Value
    Type A
    Host Enter @
    Value Paste the stableInboundIP you copied from the Azure portal.
    TTL (if applicable) Leave as default value.

  3. Save changes to your DNS record.

    Since DNS settings need to propagate, this process can take some time to complete.

  4. Open a new browser tab and go to your apex domain.

    After the DNS records are updated, you should see your static web app in the browser. Also, inspect the location to verify that your site is served securely using https.

Next steps

Manage the default domain