Quando usar HTTPS para desenvolvimento local

Usar http://localhost para desenvolvimento local é adequado na maioria das vezes, exceto em alguns casos especiais. Esta postagem explica quando é necessário executar seu site de desenvolvimento local com HTTPS.

Maud Nalpas

Consulte também: Como usar HTTPS para desenvolvimento local.

Nesta postagem, as declarações sobre localhost também são válidas para 127.0.0.1 e [::1], já que ambos descrevem o endereço do computador local, também chamado de "endereço de loopback". Além disso, para simplificar, o número da porta não é especificado. Então, quando você vir http://localhost, leia como http://localhost:{PORT} ou http://127.0.0.1:{PORT}.

Resumo

Ao desenvolver localmente, use http://localhost por padrão. Service Workers, API Web Authentication e muito mais vão funcionar. No entanto, nos seguintes casos, você precisará do HTTPS para desenvolvimento local:

  • Depurar problemas de conteúdo misto
  • Como usar HTTP/2 e versões mais recentes
  • Usar bibliotecas ou APIs de terceiros que exigem HTTPS

  • Como usar um nome de host personalizado

    Uma lista de casos em que você precisa usar HTTPS para desenvolvimento local.
    Quando usar HTTPS para desenvolvimento local.

✨ Isso é tudo o que você precisa saber. Se quiser saber mais, continue lendo.

Por que seu site de desenvolvimento precisa ter um comportamento seguro

Para evitar problemas inesperados, é importante que o site de desenvolvimento local se comporte o máximo possível como o site de produção. Portanto, se o site de produção usa HTTPS, você quer que o site de desenvolvimento local se comporte como um site HTTPS.

Usar http://localhost por padrão

Os navegadores tratam http://localhost de uma maneira especial: embora seja HTTP, ele se comporta principalmente como um site HTTPS.

No http://localhost, os service workers, as APIs Sensor, Authentication e Payments e outros recursos que exigem determinadas garantias de segurança são compatíveis e funcionam exatamente como em um site HTTPS.

Quando usar HTTPS para desenvolvimento local

Você pode encontrar casos especiais em que http://localhost não se comporta como um site HTTPS ou simplesmente querer usar um nome de site personalizado que não seja http://localhost.

É necessário usar HTTPS para desenvolvimento local nos seguintes casos:

  • Você precisa depurar localmente um problema que ocorre apenas em um site HTTPS, mas não em um HTTP, nem mesmo http://localhost, como um problema de conteúdo misto.
  • É necessário testar ou reproduzir localmente um comportamento específico do HTTP/2 ou mais recente. Por exemplo, se você precisar testar o desempenho de carregamento no HTTP/2 ou em versões mais recentes. O HTTP/2 ou mais recente não seguro não é compatível, nem mesmo no localhost.
  • É necessário testar localmente bibliotecas ou APIs de terceiros que exigem HTTPS (por exemplo, OAuth).

  • Você não está usando localhost, mas um nome de host personalizado para desenvolvimento local, por exemplo, mysite.example. Normalmente, isso significa que você substituiu o arquivo hosts local:

    Captura de tela de um terminal editando um arquivo de hosts
    Edição de um arquivo de hosts para adicionar um nome do host personalizado.

    Nesse caso, o Chrome, o Edge, o Safari e o Firefox não consideram mysite.example seguro por padrão, mesmo que seja um site local. Portanto, ele não vai se comportar como um site HTTPS.

  • Outros casos! Esta não é uma lista exaustiva, mas, se você encontrar um caso que não esteja listado aqui, saberá: as coisas vão quebrar em http://localhost ou não vão se comportar como seu site de produção. 🙃

Em todos esses casos, é necessário usar HTTPS para desenvolvimento local.

Como usar HTTPS para desenvolvimento local

Se você precisar usar HTTPS para desenvolvimento local, acesse Como usar HTTPS para desenvolvimento local.

Dicas se você estiver usando um nome de host personalizado

Se você estiver usando um nome de host personalizado, por exemplo, editando o arquivo de hosts:

  • Não use um nome de host simples, como mysite, porque, se houver um domínio de nível superior (TLD) com o mesmo nome (mysite), você terá problemas. E isso não é tão improvável: em 2020, havia mais de 1.500 TLDs, e a lista está crescendo. coffee, museum, travel e muitos nomes de grandes empresas (talvez até a empresa em que você trabalha) são TLDs. Confira a lista completa aqui.
  • Use apenas domínios que são seus ou que foram reservados para essa finalidade. Se você não tiver um domínio próprio, use test ou localhost (mysite.localhost). test não tem tratamento especial em navegadores, mas localhost tem: o Chrome e o Edge oferecem suporte a http://<name>.localhost por padrão, e ele se comporta de maneira segura quando o localhost faz isso. Teste: execute qualquer site no localhost e acesse http://<whatever name you like>.localhost:<your port> no Chrome ou Edge. Em breve, isso também será possível no Firefox e no Safari. Isso é possível porque localhost não é apenas um nome do host, mas também um TLD completo, como com.mysite.localhost

Saiba mais

Agradecemos muito as contribuições e o feedback de todos os revisores, especialmente Ryan Sleevi, Filippo Valsorda, Milica Mihajlija, Rowan Merewood e Jake Archibald. 🙌

Imagem principal de @moses_lee no Unsplash, editada.