Configuración de un dominio personalizado con Azure DNS en Azure Static Web Apps

De manera predeterminada, Azure Static Web Apps proporciona un nombre de dominio generado automáticamente para el sitio web, pero puede apuntar un dominio personalizado a su sitio. Los certificados SSL/TLS gratuitos se crean automáticamente para el nombre de dominio generado automáticamente y los dominios personalizados que pueda agregar.

En esta guía se muestra cómo configurar el nombre de dominio con el subdominio www. Una vez completado este procedimiento, puede configurar un dominio de vértice.

El procedimiento siguiente requiere que copie la configuración de una zona de Azure DNS que cree y la aplicación web estática existente. Considere la posibilidad de abrir Azure Portal en dos ventanas diferentes para facilitar el cambio entre los dos servicios.

Requisitos previos

Asignación del dominio al sitio web

Ahora que el dominio está configurado para que Azure administre DNS, puede vincular la zona DNS a la aplicación web estática.

Obtención de una dirección URL de aplicación web estática

  1. Abra Azure Portal.

  2. Vaya a la aplicación web estática.

  3. En la ventana Información general, copie la dirección URL generada del sitio y resérvela en un editor de texto para su uso futuro.

Creación de registros DNS en Azure DNS

  1. Vuelva a la zona DNS que creó en Azure Portal.

  2. Seleccione + Conjunto de registros.

  3. Escriba los valores siguientes en la ventana Agregar conjunto de registros.

    Configuración Propiedad
    Nombre Escriba www.
    Tipo Seleccione CNAME: vincular el subdominio a otra cuenta.
    Conjunto de registros de alias así que seleccione No.
    TTL Mantenga el valor predeterminado.
    Unidad de TTL Mantenga el valor predeterminado.
    Alias Pegue la dirección URL generada de Static Web Apps que ha reservado en un paso anterior. Asegúrese de quitar el prefijo https:// de la dirección URL.

    Además, puede seleccionar Sí en Conjunto de registros de alias y seleccionar la aplicación web estática en lugar de proporcionar explícitamente la dirección URL para aprovechar los conjuntos de registros de alias, como la prevención de registros DNS pendientes.

  4. Seleccione Aceptar.

Configuración del dominio personalizado de una aplicación web estática

  1. Vuelva a la aplicación web estática en el portal.

  2. En Configuración, seleccione Dominios personalizados.

  3. Seleccione + Agregar.

  4. En el cuadro Subdominio , escriba el nombre del subdominio (es decir, www). A continuación, el campo Dominio completo debe mostrar el nombre del dominio personalizado, incluido el subdominio.

    Nota:

    Si ha delegado el dominio a Azure DNS y también ha elegido Agregar dominio personalizado en Azure DNS al configurar el dominio personalizado, tendrá la opción de seleccionar la zona DNS de Azure. Los pasos siguientes se realizarán automáticamente después de seleccionar Agregar.

  5. Seleccione Siguiente.

  6. En la pestaña Validar y agregar , escriba los valores siguientes.

    Configuración Valor
    Nombre de dominio Este valor debe coincidir con el nombre de dominio que escribió en el paso anterior (con el subdominio www).
    Tipo de registro del nombre de host Seleccione CNAME. .
  7. Seleccione Agregar.

    Si recibe un error que dice que la acción no es válida, espere 5 minutos e inténtelo de nuevo.

  8. Abra una nueva pestaña del explorador y vaya al dominio con el subdominio www.

    Una vez actualizados los registros DNS, debería ver la aplicación web estática en el explorador. Además, inspeccione la ubicación para comprobar que el sitio se sirve de forma segura mediante https.

Pasos siguientes