Cuándo usar HTTPS para desarrollo local

El uso de http://localhost para el desarrollo local es adecuado la mayor parte del tiempo, excepto en algunos casos especiales. En esta publicación, se explica cuándo debes ejecutar tu sitio de desarrollo local con HTTPS.

Maud Nalpas
Maud Nalpas

Consulta también Cómo usar HTTPS para el desarrollo local.

En esta publicación, las afirmaciones sobre localhost también son válidas para 127.0.0.1 y [::1], ya que ambas describen la dirección de la computadora local, también llamada "dirección de bucle invertido". Además, para simplificar, no se especifica el número de puerto. Por lo tanto, cuando veas http://localhost, léelo como http://localhost:{PORT} o http://127.0.0.1:{PORT}.

Resumen

Cuando desarrolles de forma local, usa http://localhost de forma predeterminada. Los trabajadores del servicio, la API de Web Authentication y mucho más funcionarán. Sin embargo, en los siguientes casos, necesitarás HTTPS para el desarrollo local:

  • Cómo depurar problemas de contenido mixto
  • Usa HTTP/2 y versiones posteriores
  • Usar bibliotecas o APIs de terceros que requieran HTTPS
  • Usa un nombre de host personalizado

    Una lista de casos en los que debes usar HTTPS para el desarrollo local.
    Cuándo usar HTTPS para el desarrollo local.

✨ Esto es todo lo que necesitas saber. Si te interesa obtener más detalles, sigue leyendo.

Por qué tu sitio de desarrollo debe comportarse de forma segura

Para evitar problemas inesperados, debes asegurarte de que tu sitio de desarrollo local se comporte lo más parecido posible a tu sitio web de producción. Por lo tanto, si tu sitio web de producción usa HTTPS, debes hacer que tu sitio de desarrollo local se comporte como un sitio HTTPS.

Usar http://localhost de forma predeterminada

Los navegadores tratan http://localhost de una manera especial: aunque es HTTP, se comporta principalmente como un sitio HTTPS.

En http://localhost, se admiten los trabajadores de servicio, las APIs de sensores, las APIs de autenticación, los pagos y otras funciones que requieren ciertas garantías de seguridad, y se comportan exactamente como en un sitio HTTPS.

Cuándo usar HTTPS para el desarrollo local

Es posible que encuentres casos especiales en los que http://localhost no se comporte como un sitio HTTPS, o simplemente quieras usar un nombre de sitio personalizado que no sea http://localhost.

Debes usar HTTPS para el desarrollo local en los siguientes casos:

  • Debes depurar de forma local un problema que solo ocurre en un sitio web HTTPS, pero no en un sitio HTTP, ni siquiera en http://localhost, como un problema de contenido mixto.
  • Debes probar o reproducir de forma local un comportamiento específico de HTTP/2 o versiones posteriores. Por ejemplo, si necesitas probar el rendimiento de carga en HTTP/2 o versiones posteriores. No se admite HTTP/2 no seguro ni versiones posteriores, ni siquiera en localhost.
  • Debes probar de forma local las bibliotecas o APIs de terceros que requieren HTTPS (por ejemplo, OAuth).
  • No estás usando localhost, sino un nombre de host personalizado para el desarrollo local, por ejemplo, mysite.example. Por lo general, esto significa que anulaste tu archivo hosts local:

    Captura de pantalla de una terminal que edita un archivo hosts
    Edición de un archivo hosts para agregar un nombre de host personalizado.

    En este caso, Chrome, Edge, Safari y Firefox no consideran que mysite.example es seguro de forma predeterminada, a pesar de que es un sitio local. Por lo tanto, no se comportará como un sitio HTTPS.

  • Otros casos Esta no es una lista exhaustiva, pero si encuentras un caso que no aparece aquí, sabrás que se producirán errores en http://localhost o que no se comportará como tu sitio de producción. 🙃

En todos estos casos, debes usar HTTPS para el desarrollo local.

Cómo usar HTTPS para el desarrollo local

Si necesitas usar HTTPS para el desarrollo local, consulta Cómo usar HTTPS para el desarrollo local.

Sugerencias si usas un nombre de host personalizado

Si usas un nombre de host personalizado, por ejemplo, editando el archivo hosts, haz lo siguiente:

  • No uses un nombre de host sin formato, como mysite, porque si hay un dominio de nivel superior (TLD) que tiene el mismo nombre (mysite), tendrás problemas. Y no es tan improbable: en 2020, hay más de 1,500 TLD, y la lista sigue creciendo. coffee, museum, travel y muchos nombres de empresas grandes (¡tal vez incluso la empresa en la que trabajas!) son TLD. Consulta la lista completa aquí.
  • Usa solo dominios que sean tuyos o que estén reservados para este fin. Si no tienes tu propio dominio, puedes usar test o localhost (mysite.localhost). test no tiene un tratamiento especial en los navegadores, pero localhost sí: Chrome y Edge admiten http://<name>.localhost de forma predeterminada, y se comportará de forma segura cuando lo haga localhost. Pruébala: ejecuta cualquier sitio en localhost y accede a http://<whatever name you like>.localhost:<your port> en Chrome o Edge. Es posible que pronto también sea posible en Firefox y Safari. La razón por la que puedes hacer esto (tener subdominios como mysite.localhost) es porque localhost no es solo un nombre de host: también es un TLD completo, como com.

Más información

Muchas gracias a todos los revisores por sus contribuciones y comentarios, en especial a Ryan Sleevi, Filippo Valsorda, Milica Mihajlija, Rowan Merewood y Jake Archibald. 🙌

Imagen hero de @moses_lee en Unsplash, editada.