Comment servir des sous-domaines NGINX ou plusieurs domaines

Tutoriels
Nginx

Avez-vous un serveur avec une seule adresse IP publique, mais avez besoin d’héberger plusieurs domaines ou sous-domaines ? Que feriez-vous ? Ce scénario peut être déroutant si vous êtes débutant. Mais ne vous inquiétez pas, ce tutoriel est là pour vous aider, afin que vous puissiez héberger un sous-domaine NGINX et plusieurs domaines.

Dans ce tutoriel, vous apprendrez comment servir efficacement des sous-domaines NGINX ou plusieurs domaines sur un serveur avec une seule adresse IP !

Si vous êtes prêt, passons à l’action !

Prérequis

Ce tutoriel propose des démonstrations pratiques, mais ne nécessite pas beaucoup de prérequis et suppose que vous disposez d’un serveur Ubuntu LTS avec SSH activé et NGINX installé. Les démonstrations de ce tutoriel sont basées sur Ubuntu Server LTS 20.04.1.

Configuration des enregistrements DNS

Avant de pouvoir servir des sous-domaines NGINX ou plusieurs domaines, vous devrez ajouter un enregistrement A dans un panneau de contrôle DNS. L’enregistrement A lie et pointe tous les domaines et sous-domaines vers une seule adresse IP pour permettre aux navigateurs web de trouver votre site web.

Articles connexes :Comment utiliser PowerShell pour les enregistrements DNS

1. Lancez votre navigateur web préféré et connectez-vous à votre panneau de contrôle DNS.

2. Cliquez sur Ajouter un enregistrement pour commencer à ajouter des enregistrements A. Votre navigateur vous redirige vers une page où vous configurerez les paramètres DNS pour votre domaine et vos sous-domaines.

Adding an A Record

Configurez maintenant les paramètres DNS comme suit :

Sélectionnez Enregistrement A dans le champ Type.

Entrez @ dans le champ Hôte et votre adresse IP de serveur dans le champ Valeur.

Sélectionnez la valeur souhaitée dans le champ TTL, puis cliquez sur le bouton Confirmer pour enregistrer les paramètres.

Répétez le même processus pour les autres sous-domaines.

Configuring DNS settings for Domain and Subdomains The final DNS Settings page looks like the one below.

La page finale Paramètres DNS ressemble à celle-ci-dessous.

Viewing DNS Settings Page

Votre panneau de contrôle des enregistrements DNS peut différer en fonctionnalités et en design, mais les mêmes principes s’appliqueront à tous.

Configuration des répertoires web pour les domaines et sous-domaines NGINX

Maintenant que vous avez ajouté des enregistrements A pour votre domaine et vos sous-domaines, il est temps de configurer leurs répertoires web. NGINX est livré avec un fichier de virtual host par défaut et est configuré pour servir un répertoire web situé à /usr/share/nginx/html.

Vous créerez un répertoire web distinct pour chaque domaine à l’intérieur du répertoire racine des documents par défaut de NGINX (/var/www/html).

1. Tout d’abord, ouvrez votre terminal et exécutez les commandes ci-dessous pour créer des répertoires web pour tous les domaines et sous-domaines. Ce faisant, vous séparez, organisez et isolez les fichiers pour chaque site web. 

sudo mkdir /var/www/html/awstutorial.net
sudo mkdir /var/www/html/web1.awstutorial.net
sudo mkdir /var/www/html/web2.awstutorial.net

2. Ensuite, exécutez la commande chown pour changer récursivement (-R) la propriété de chaque répertoire que vous avez créé à l’étape un à l’utilisateur et au groupe www-data. Vous modifiez la propriété de chaque répertoire à l’utilisateur et au groupe www-data car NGINX s’exécute en tant qu’utilisateur www-data. 

sudo chown -R www-data:www-data /var/www/html/awstutorial.net
sudo chown -R www-data:www-data /var/www/html/web1.awstutorial.net
sudo chown -R www-data:www-data /var/www/html/web2.awstutorial.net

3. Créez un fichier nommé index.html dans votre éditeur de code préféré, puis copiez/collez le code ci-dessous dans le fichier index.html. Enregistrez le fichier à l’intérieur du répertoire web principal de vos domaines (/var/www/html/awstutorial.net).

Le code HTML ci-dessous affiche un message qui dit « Félicitations ! Le site awstutorial.net fonctionne ! » lorsque le fichier index.html est ouvert dans un navigateur web. 

<html>
	<head>
	  <title>Welcome to awstutorial.net!</title>
  </head>
	  <body>
	    <h1>Congratulations! The awstutorial.net website is working!</h1>
    </body>
</html>

4. Enfin, créez le même fichier index.html dans les répertoires /var/www/html/web1.awstutorial.net et /var/www/html/web2.awstutorial.net. Mais remplacez awstutorial.net par web1.awstutorial.net et web2.awstutorial.net dans le code de chaque fichier index.html en conséquence.

Configuration de l’hôte virtuel pour le domaine NGINX et les sous-domaines

Vous avez déjà une page index.html pour votre domaine et vos sous-domaines à servir via un serveur web NGINX. La prochaine étape consiste à créer un fichier de configuration d’hôte virtuel NGINX pour chaque domaine afin de servir les pages HTML.

Lié :Comment tester votre configuration NGINX avant de la bousiller

1. Créez un fichier de configuration de virtual host NGINX nommé awstutorial.net dans votre éditeur de code préféré, puis copiez/collez le code ci-dessous dans ce fichier. Enregistrez le fichier dans le répertoire /etc/nginx/sites-available/.

Le code ci-dessous contrôle le comportement de votre serveur, tel que le nom du serveur et la page d’index (accueil) lorsque un utilisateur essaie d’accéder à votre domaine. 

server {
        # Lie le port TCP 80.
        listen 80; 

				# Répertoire racine utilisé pour rechercher un fichier
        root /var/www/html/awstutorial.net;
				# Définit le fichier à utiliser comme page d'index
        index index.html index.htm;
				# Définit le nom de domaine ou sous-domaine. 
        # Si aucun server_name n'est défini dans un bloc de serveur alors 
				# Nginx utilise le nom 'vide'
        server_name awstutorial.net;

        location / {
            # Renvoie une erreur 404 pour les cas où le serveur reçoit 
						# des demandes de fichiers et répertoires introuvables.
            try_files $uri $uri/ =404;
        }
    }

2. Ensuite, exécutez la commande suivante nginx pour vérifier (-t) le fichier de configuration NGINX pour toute erreur de syntaxe. 

sudo nginx -t

Si aucune erreur de syntaxe n’est trouvée dans le fichier de configuration NGINX, vous obtiendrez la sortie suivante.

Verifying NGINX configuration file

3. Ensuite, exécutez la commande ci-dessous pour créer un lien symbolique (ln -s) depuis le répertoire /etc/nginx/sites-available vers le répertoire /etc/nginx/sites-enabled/. Cette commande active le fichier de configuration du hôte virtuel awstutorial.net. 

sudo ln -s /etc/nginx/sites-available/awstutorial.net /etc/nginx/sites-enabled/

Les formats sites-available et sites-enabled sont standard dans une installation NGINX Ubuntu mais d’autres distributions peuvent utiliser un standard différent.

4. Répétez les étapes un à trois pour créer les fichiers de configuration de l’hôte virtuel NGINX nommés web1.awstutorial.net et web2.awstutorial.net.

Modifiez les lignes suivantes dans chaque fichier de configuration de l’hôte virtuel NGINX :

  • Remplacez la ligne root /var/www/html/awstutorial.net par le répertoire racine de chaque sous-domaine (root /var/www/html/web1.awstutorial.net et root /var/www/html/web2.awstutorial.net).
  • Remplacez la ligne server_name awstutorial.net par le nom de chaque sous-domaine (server_name web1.awstutorial.net et server_name web2.awstutorial.net).

5. Maintenant, exécutez les commandes sudo ln ci-dessous comme vous l’avez fait à l’étape trois pour activer les fichiers de configuration de l’hôte virtuel.

# Active le fichier de configuration du virtual host NGINX pour web1.awstutorial.net
sudo ln -s /etc/nginx/sites-available/web1.awstutorial.net /etc/nginx/sites-enabled/
# Active le fichier de configuration du virtual host NGINX pour web2.awstutorial.net
sudo ln -s /etc/nginx/sites-available/web2.awstutorial.net /etc/nginx/sites-enabled/

6. Exécutez la commande systemctl ci-dessous pour redémarrer le service NGINX (restart nginx) et appliquer toutes les modifications de configuration. 

sudo systemctl restart nginx

7. Enfin, accédez aux URL du domaine et des sous-domaines dans votre navigateur pour tester si les sites fonctionnent correctement.

Articles connexes :Comment utiliser Python pour effectuer des tests de charge sur des sites web

Si le domaine et les sous-domaines se chargent, vous verrez un message similaire à celui ci-dessous.

Verifying websites are loading through the web browser.

Configuration de HTTPS sur le domaine et les sous-domaines NGINX

Vous avez réussi à configurer et tester un domaine NGINX et des sous-domaines en protocole HTTP, ce qui est excellent. Mais vous devez sécuriser la connexion de votre domaine et de vos sous-domaines en activant HTTPS. Comment ? Avec un certificat que vous obtiendrez auprès d’une autorité de certification telle que Let’s Encrypt SSL.

1. Tout d’abord, exécutez la commande ci-dessous pour installer le package logiciel Certbot (apt-get install certbot). Certbot vous permet de télécharger un certificat SSL pour votre domaine et vos sous-domaines.

sudo apt-get install certbot python3-certbot-nginx -y

2. Ensuite, exécutez la commande certbot ci-dessous pour télécharger un certificat SSL (certonly) pour votre domaine (-d awstutorial.net). Remarquez que vous acceptez les conditions de service (—agree-tos) avec votre adresse e-mail (—email). 

sudo certbot certonly --agree-tos --email [email protected] -d awstutorial.net

Remplacez l’e-mail par le vôtre.

3. Entrez ‘1’ pour sélectionner le plugin NGINX Web Server (nginx) pour vous authentifier auprès du CA ACME, comme indiqué ci-dessous.

Selecting Plugin to Authenticate with ACME CA

Après avoir sélectionné le plugin NGINX Web Server, vous verrez la progression du téléchargement du certificat SSL pour votre domaine (awstutorial.net).

Par défaut, les certificats SSL de Let’s Encrypt sont stockés dans le répertoire /etc/letsencrypt/live/.

Showing Download Progress of the SSL Certificate

4. Exécutez maintenant chaque commande ci-dessous comme vous l’avez fait à l’étape deux pour télécharger les certificats SSL pour les sous-domaines restants (web1.awstutorial.net et web2.awstutorial.net). 

sudo certbot certonly --agree-tos --email [email protected] -d web1.awstutorial.net
sudo certbot certonly --agree-tos --email [email protected] -d web2.awstutorial.net

5. Enfin, exécutez la commande ls ci-dessous pour répertorier tous les certificats SSL dans le répertoire /etc/letsencrypt/live/ qui contiennent (*) le awstutorial.net dans leurs noms. Cela vous permet de vérifier que les certificats SSL existent. 

ls /etc/letsencrypt/live/*awstutorial.net/

Ci-dessous, vous verrez les certificats SSL pour votre domaine et vos sous-domaines.

Showing SSL certificate for all domains.

Configuration du hôte virtuel NGINX pour utiliser des certificats SSL

À ce stade, vous disposez déjà de certificats SSL. Mais comment les utilisez-vous pour sécuriser votre domaine et vos sous-domaines ? Vous définirez le chemin des certificats dans le bloc server de chaque fichier de configuration d’hôte virtuel NGINX.

1. Ouvrez le fichier de configuration de l’hôte virtuel NGINX de awstutorial.net situé dans le répertoire /etc/nginx/sites-available/ dans votre éditeur de code préféré.

2. Remplacez le contenu du fichier par le code ci-dessous, où vous définissez le chemin du certificat SSL de votre domaine et le protocole SSL (sous Chemin du certificat SSL).

server {
	     # Lie le port TCP 80.
       listen 80;
	     # Définit le nom de domaine ou de sous-domaine. 
       # Si aucun server_name n'est défini dans un bloc server alors 
	     # Nginx utilise le nom 'vide'
       server_name awstutorial.net;
	     # Redirige le trafic vers le 
	     # bloc server HTTPS correspondant avec le code d'état 301
       return 301 https://$host$request_uri;
       }

server {
        # Lie le port TCP 443 et active SSL.
        listen 443 SSL;
	      # Répertoire racine utilisé pour rechercher un fichier        
	      root /var/www/html/awstutorial.net; 
	      # Définit le nom de domaine ou de sous-domaine. 
        # Si aucun server_name n'est défini dans un bloc server alors 
	      # Nginx utilise le nom 'vide'
        server_name awstutorial.net;

	      # Chemin du certificat SSL
        ssl_certificate /etc/letsencrypt/live/awstutorial.net/fullchain.pem;
        ssl_certificate_key /etc/letsencrypt/live/awstutorial.net/privkey.pem;
	      # Utilise le fichier généré par la commande certbot.
        include /etc/letsencrypt/options-ssl-nginx.conf;
	      # Définit le chemin du fichier dhparam.pem.
        ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem;

        location / {
	      # Renvoie une erreur 404 pour les instances où le serveur reçoit 
	      # des demandes pour des fichiers et répertoires introuvables.
        try_files $uri $uri/ =404;
        }

    }

3. Répétez le même processus (étapes un à deux) pour les fichiers de configuration d’hôte virtuel restants (web1.awstutorial.net et web2.awstutorial.net). Assurez-vous cependant de remplacer le chemin du certificat SSL par le chemin du certificat de sous-domaine (sous Chemin du certificat SSL).

4. Maintenant, relancez la commande systemctl ci-dessous pour redémarrer le service NGINX et appliquer les modifications de configuration. 

sudo systemctl restart nginx

5. Enfin, accédez aux URL de votre domaine et de vos sous-domaines dans votre navigateur web. Mais cette fois, au lieu du protocole HTTP, utilisez HTTPS pour voir s’ils fonctionnent.

Vous verrez ci-dessous une icône de cadenas dans la barre d’adresse, ce qui indique que le site Web est sécurisé avec votre certificat SSL.

Verifying Domain is Secure

Conclusion

Dans ce tutoriel, vous avez appris comment servir un sous-domaine NGINX ou plusieurs domaines en configurant un fichier de configuration d’hôte virtuel. Vous avez également abordé la sécurisation de vos domaines avec un certificat SSL que vous définissez également dans le fichier de configuration d’hôte virtuel.

Maintenant, pourquoi ne pas utiliser cette configuration dans un environnement de production, par exemple pour héberger plusieurs applications sur un seul serveur, et fournir un hébergement web abordable?

Source:
https://adamtheautomator.com/nginx-subdomain/