Quand utiliser HTTPS pour le développement local ?

L'utilisation de http://localhost pour le développement local est généralement acceptable, sauf dans certains cas particuliers. Cet article explique quand vous devez exécuter votre site de développement local avec HTTPS.

Consultez également : Utiliser HTTPS pour le développement local.

Dans cet article, les instructions concernant localhost sont également valables pour 127.0.0.1 et [::1], car ils décrivent tous deux l'adresse de l'ordinateur local, également appelée "adresse de bouclage". De plus, pour simplifier, le numéro de port n'est pas spécifié. Ainsi, lorsque vous voyez http://localhost, lisez-le comme http://localhost:{PORT} ou http://127.0.0.1:{PORT}.

Résumé

Lorsque vous développez en local, utilisez http://localhost par défaut. Les service workers, l'API Web Authentication et d'autres éléments fonctionneront. Toutefois, dans les cas suivants, vous aurez besoin de HTTPS pour le développement local :

  • Débogage des problèmes de contenu mixte
  • Utilisation de HTTP/2 et versions ultérieures
  • Utilisation de bibliothèques ou d'API tierces nécessitant HTTPS
  • Utilisation d'un nom d'hôte personnalisé

    Liste des cas où vous devez utiliser HTTPS pour le développement en local.
    Quand utiliser HTTPS pour le développement local.

✨ C'est tout ce que vous devez savoir. Si vous souhaitez en savoir plus, continuez votre lecture.

Pourquoi votre site de développement doit-il se comporter de manière sécurisée ?

Pour éviter tout problème inattendu, vous devez faire en sorte que votre site de développement local se comporte autant que possible comme votre site Web de production. Par conséquent, si votre site Web de production utilise HTTPS, vous devez faire en sorte que votre site de développement local se comporte comme un site HTTPS.

Utiliser http://localhost par défaut

Les navigateurs traitent http://localhost de manière spéciale : bien qu'il s'agisse de HTTP, il se comporte principalement comme un site HTTPS.

Sur http://localhost, les service workers, les API de capteur, les API d'authentification, les paiements et d'autres fonctionnalités nécessitant certaines garanties de sécurité sont compatibles et se comportent exactement comme sur un site HTTPS.

Quand utiliser HTTPS pour le développement local

Vous pouvez rencontrer des cas particuliers où http://localhost ne se comporte pas comme un site HTTPS, ou vous pouvez simplement vouloir utiliser un nom de site personnalisé autre que http://localhost.

Vous devez utiliser HTTPS pour le développement local dans les cas suivants :

  • Vous devez déboguer localement un problème qui ne se produit que sur un site Web HTTPS, mais pas sur un site HTTP, pas même http://localhost, comme un problème de contenu mixte.
  • Vous devez tester ou reproduire localement un comportement spécifique à HTTP/2 ou version ultérieure. Par exemple, si vous devez tester les performances de chargement sur HTTP/2 ou version ultérieure. HTTP/2 ou version ultérieure non sécurisé n'est pas compatible, même sur localhost.
  • Vous devez tester localement des bibliothèques ou des API tierces nécessitant HTTPS (par exemple, OAuth).
  • Vous n'utilisez pas localhost, mais un nom d'hôte personnalisé pour le développement local, par exemple mysite.example. En règle générale, cela signifie que vous avez remplacé votre fichier d'hôtes local :

    Capture d'écran d'un terminal modifiant un fichier hosts
    Modifier un fichier d'hôtes pour ajouter un nom d'hôte personnalisé.

    Dans ce cas, Chrome, Edge, Safari et Firefox ne considèrent pas mysite.example comme sécurisé par défaut, même s'il s'agit d'un site local. Il ne se comportera donc pas comme un site HTTPS.

  • Autres cas Cette liste n'est pas exhaustive, mais si vous rencontrez un cas qui n'y figure pas, vous le saurez : les éléments ne fonctionneront pas sur http://localhost ou ne se comporteront pas tout à fait comme votre site de production. 🙃

Dans tous ces cas, vous devez utiliser HTTPS pour le développement local.

Utiliser HTTPS pour le développement local

Si vous devez utiliser HTTPS pour le développement local, consultez Utiliser HTTPS pour le développement local.

Conseils si vous utilisez un nom d'hôte personnalisé

Si vous utilisez un nom d'hôte personnalisé, par exemple en modifiant votre fichier d'hôtes :

  • N'utilisez pas de nom d'hôte simple comme mysite, car si un domaine de premier niveau (TLD) porte le même nom (mysite), vous rencontrerez des problèmes. Et ce n'est pas si improbable : en 2020, il existe plus de 1 500 TLD, et la liste ne cesse de s'allonger. coffee, museum, travel et de nombreux noms de grandes entreprises (peut-être même celle pour laquelle vous travaillez !) sont des TLD. Consultez la liste complète ici.
  • N'utilisez que les domaines qui vous appartiennent ou qui sont réservés à cet usage. Si vous ne possédez pas de domaine, vous pouvez utiliser test ou localhost (mysite.localhost). test n'est pas traité de manière spéciale dans les navigateurs, mais localhost l'est : Chrome et Edge sont compatibles avec http://<name>.localhost prêts à l'emploi, et il se comportera de manière sécurisée lorsque localhost le fera. Essayez : exécutez n'importe quel site sur localhost et accédez à http://<whatever name you like>.localhost:<your port> dans Chrome ou Edge. Cela sera peut-être bientôt possible dans Firefox et Safari. La raison pour laquelle vous pouvez le faire (avoir des sous-domaines comme mysite.localhost) est que localhost n'est pas seulement un nom d'hôte : il s'agit également d'un TLD complet, comme com.

En savoir plus

Merci beaucoup à tous les examinateurs pour leurs contributions et leurs commentaires, en particulier Ryan Sleevi, Filippo Valsorda, Milica Mihajlija, Rowan Merewood et Jake Archibald. 🙌

Image héros par @moses_lee sur Unsplash, modifiée.