{"id":2218,"date":"2023-01-02T00:01:08","date_gmt":"2023-01-01T23:01:08","guid":{"rendered":"https:\/\/www.webodesign.net\/?p=2218"},"modified":"2023-01-02T17:54:19","modified_gmt":"2023-01-02T16:54:19","slug":"ajouter-des-sous-domaines-au-site-principal-webodesign-net","status":"publish","type":"post","link":"https:\/\/www.webodesign.net\/?p=2218","title":{"rendered":"Ajouter des sous domaines au site principal webodesign.net"},"content":{"rendered":"\n<div class=\"wp-block-uagb-container uagb-block-264fd1f9 alignfull uagb-is-root-container\"><div class=\"uagb-container-inner-blocks-wrap\">\n<div class=\"wp-block-columns is-layout-flex wp-container-14\">\n<div class=\"wp-block-column is-layout-flow\">\n<div class=\"wp-block-group is-layout-flow\">\n<div class=\"wp-block-group is-layout-constrained\" style=\"border-style:none;border-width:0px;border-radius:0px\">\t\t\t\t<div class=\"wp-block-uagb-table-of-contents uagb-toc__align-left uagb-toc__columns-1  uagb-block-e5483529     \"\n\t\t\t\t\tdata-scroll= \"1\"\n\t\t\t\t\tdata-offset= \"30\"\n\t\t\t\t\tstyle=\"\"\n\t\t\t\t>\n\t\t\t\t<div class=\"uagb-toc__wrap\">\n\t\t\t\t\t\t<div class=\"uagb-toc__title\">\n\t\t\t\t\t\t\tSommaire\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"uagb-toc__list-wrap\">\n\t\t\t\t\t\t<ol class=\"uagb-toc__list\"><li class=\"uagb-toc__list\"><a href=\"#pr\u00e9sentation\" class=\"uagb-toc-link__trigger\">Pr\u00e9sentation<\/a><li class=\"uagb-toc__list\"><a href=\"#installation-dapache\" class=\"uagb-toc-link__trigger\">Installation d&#039;Apache<\/a><li class=\"uagb-toc__list\"><a href=\"#\u00e9tat-des-lieux-des-emplacements-de-fichiers-apache\" class=\"uagb-toc-link__trigger\">\u00c9tat des lieux des emplacements de fichiers Apache<\/a><li class=\"uagb-toc__list\"><a href=\"#cr\u00e9ation-dune-structure-de-fichiers-pour-les-h\u00f4tes-virtuels\" class=\"uagb-toc-link__trigger\">Cr\u00e9ation d&#039;une structure de fichiers pour les h\u00f4tes virtuels<\/a><li class=\"uagb-toc__list\"><a href=\"#cr\u00e9ation-des-pages-indexhtml-pour-nos-sites-de-d\u00e9monstration\" class=\"uagb-toc-link__trigger\">Cr\u00e9ation des pages &quot;index.html&quot; pour nos sites de d\u00e9monstration<\/a><li class=\"uagb-toc__list\"><a href=\"#cr\u00e9ation-des-fichiers-de-configuration-des-h\u00f4tes-virtuels\" class=\"uagb-toc-link__trigger\">Cr\u00e9ation des fichiers de configuration des h\u00f4tes virtuels<\/a><ul class=\"uagb-toc__list\"><li class=\"uagb-toc__list\"><a href=\"#cr\u00e9ation-du-fichier-virtualhost-du-site-1\" class=\"uagb-toc-link__trigger\">Cr\u00e9ation du fichier VirtualHost du site 1<\/a><li class=\"uagb-toc__list\"><li class=\"uagb-toc__list\"><a href=\"#cr\u00e9ation-du-fichier-virtualhost-du-site-2\" class=\"uagb-toc-link__trigger\">Cr\u00e9ation du fichier VirtualHost du site 2<\/a><\/li><\/ul><\/li><li class=\"uagb-toc__list\"><a href=\"#activation-des-nouveaux-fichiers-dh\u00f4te-virtuel\" class=\"uagb-toc-link__trigger\">Activation des nouveaux fichiers d&#039;h\u00f4te virtuel<\/a><li class=\"uagb-toc__list\"><a href=\"#test-de-la-configuration-pour-une-\u00e9coute-sur-le-port-80\" class=\"uagb-toc-link__trigger\">Test de la configuration pour une \u00e9coute sur le port 80<\/a><li class=\"uagb-toc__list\"><a href=\"#s\u00e9curisation-des-domaines-avec-les-certificats-lets-encrypt-tls\" class=\"uagb-toc-link__trigger\">S\u00e9curisation des domaines avec les certificats Let\u2019s Encrypt TLS<\/a><\/ul><\/ol>\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\n\n\n<div class=\"wp-block-group has-border-color has-vivid-cyan-blue-border-color has-background is-layout-flow\" style=\"border-style:dotted;border-width:2px;border-radius:8px;background-color:#fffdf8;padding-right:7px;padding-bottom:15px;padding-left:7px\">\n<h4 class=\"has-text-color wp-block-heading\" id=\"1-i-pr%C3%A9sentation\" style=\"color:#fffdf8;margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0;font-size:1px\">Pr\u00e9sentation<\/h4>\n\n\n\n<div class=\"qubely-block-accordion  qubely-block-d34844\" data-item-toggle=\"true\">\n<div class=\"wp-block-qubely-accordion-item qubely-block-e731ba\"><div class=\"qubely-accordion-item qubely-type-fill qubely-accordion-active\"><div class=\"qubely-accordion-panel qubely-icon-position-right\"><span class=\"qubely-accordion-panel-handler\" role=\"button\"><span class=\"qubely-accordion-panel-handler-label\">1. Pr\u00e9sentation<\/span><span class=\"qubely-accordion-icon fa fa-plus\"><\/span><\/span><\/div><div class=\"qubely-accordion-body\" style=\"display:block\"><div itemprop=\"text\">\n<p>L\u2019h\u00e9bergement virtuel est une technique permettant d\u2019h\u00e9berger plusieurs sites Web sur un seul serveur Web. Ces sites sont diff\u00e9renci\u00e9s soit par des noms de domaines diff\u00e9rents, soit par des adresses IP ou des ports diff\u00e9rents.<\/p>\n\n\n\n<p>Cette fonctionnalit\u00e9 est bien entendue support\u00e9e sous Apache, qui a \u00e9t\u00e9 l\u2019un des premiers serveurs Web \u00e0 la mettre en \u0153uvre, et par Nginx.<\/p>\n\n\n\n<p>Plusieurs techniques peuvent \u00eatre utilis\u00e9e pour r\u00e9aliser ces h\u00e9bergements virtuels&nbsp;:<\/p>\n\n\n\n<ul>\n<li><em>Les h\u00f4tes virtuels par adresse IP<\/em>&nbsp;: les requ\u00eates sont alors tri\u00e9es en fonction de l\u2019adresse IP qu\u2019elles utilisent. Chaque h\u00f4te virtuel dispose de sa propre adresse IP et r\u00e9pond alors aux requ\u00eates concernant son adresse.<\/li>\n\n\n\n<li><em>Les h\u00f4tes virtuels par port<\/em>&nbsp;: les requ\u00eates sont alors tri\u00e9es en fonction du port qu\u2019elles utilisent. Chaque h\u00f4te virtuel dispose de son propre port et r\u00e9pond alors aux requ\u00eates concernant son adresse. Cette technique n\u2019est quasiment jamais utilis\u00e9e, car utiliser un port diff\u00e9rent des ports standards (80 et 443) n\u00e9cessite de le sp\u00e9cifier dans l\u2019adresse du site (<code>http:\/\/example.org:8081\/foo\/bar<\/code>, par exemple).<\/li>\n\n\n\n<li><em>Les h\u00f4tes virtuels par nom<\/em>&nbsp;: cette technique repose sur l\u2019\u00e9volution apport\u00e9e par la norme HTTP 1.1, qui pr\u00e9voit d\u2019ajouter un champ \u00ab&nbsp;<code>Host<\/code>&nbsp;\u00bb dans les en-t\u00eates HTTP. Ce champ est alors utilis\u00e9 pour identifier l\u2019h\u00f4te virtuel qui est concern\u00e9 par une requ\u00eate donn\u00e9e.<\/li>\n\n\n\n<li><em>Les h\u00f4tes virtuels dynamiques<\/em>&nbsp;: qui ne poss\u00e8dent pas de configuration propre, mais qui sont d\u00e9termin\u00e9s \u00e0 partir de l\u2019URL de la requ\u00eate. Il est alors possible en utilisant quelques r\u00e8gles de d\u00e9crire le comportement d\u2019un ensemble d\u2019h\u00f4tes virtuels.<\/li>\n<\/ul>\n<\/div><\/div><\/div><\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group has-border-color has-vivid-cyan-blue-border-color has-background is-layout-flow\" style=\"border-style:dotted;border-width:2px;border-radius:8px;background-color:#fffdf8;padding-right:7px;padding-bottom:15px;padding-left:7px\">\n<h4 class=\"has-text-color wp-block-heading\" id=\"2-ii-installation-de-phpmyadmin\" style=\"color:#fffdf8;margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0;font-size:1px\">Installation d&rsquo;Apache<\/h4>\n\n\n\n<div class=\"qubely-block-accordion  qubely-block-d34844\" data-item-toggle=\"true\">\n<div class=\"wp-block-qubely-accordion-item qubely-block-530e26\"><div class=\"qubely-accordion-item qubely-type-fill qubely-accordion-active\"><div class=\"qubely-accordion-panel qubely-icon-position-right\"><span class=\"qubely-accordion-panel-handler\" role=\"button\"><span class=\"qubely-accordion-panel-handler-label\">2. Installation d&rsquo;Apache<\/span><span class=\"qubely-accordion-icon fa fa-plus\"><\/span><\/span><\/div><div class=\"qubely-accordion-body\" style=\"display:block\"><div itemprop=\"text\">\n<p>Pour installer le serveur web Apache tapez les commandes suivantes :<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">sudo apt update\nsudo apt install apache2 apache2-doc<\/pre><\/div>\n\n\n\n<p>Cela installera \u00e9galement le manuel Apache.<\/p>\n\n\n\n<p>La commande suivante affiche l&rsquo;\u00e9tat du service Apache dans une fen\u00eatre de terminal :<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">sudo systemctl status apache2<\/pre><\/div>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" loading=\"lazy\" width=\"796\" height=\"276\" src=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-01.png\" alt=\"\" class=\"wp-image-2221\" srcset=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-01.png 796w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-01-300x104.png 300w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-01-768x266.png 768w\" sizes=\"(max-width: 796px) 100vw, 796px\" \/><\/figure>\n\n\n\n<p>Le v\u00e9ritable test d&rsquo;une installation r\u00e9ussie est de savoir si l&rsquo;on acc\u00e8de aux fichiers \u00e0 partir du serveur via le navigateur local. Acc\u00e9der \u00e0 cette adresse :<\/p>\n\n\n\n<p>http:\/\/ADRESSE IP<\/p>\n\n\n\n<p>On devrait voir une page de bienvenue pour Apache sur Debian, ce qui signifie que  Apache est maintenant en cours d&rsquo;ex\u00e9cution.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" loading=\"lazy\" width=\"712\" height=\"113\" src=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-02.jpg\" alt=\"\" class=\"wp-image-2222\" srcset=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-02.jpg 712w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-02-300x48.jpg 300w\" sizes=\"(max-width: 712px) 100vw, 712px\" \/><\/figure>\n<\/div><\/div><\/div><\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group has-border-color has-vivid-cyan-blue-border-color has-background is-layout-flow\" style=\"border-style:dotted;border-width:2px;border-radius:8px;background-color:#fffdf8;padding-right:7px;padding-bottom:15px;padding-left:7px\">\n<h4 class=\"has-text-color wp-block-heading\" id=\"3-iii-cr%C3%A9ation-dun-admin-pour-phpmyadmin\" style=\"color:#fffdf8;margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0;font-size:1px\">\u00c9tat des lieux des emplacements de fichiers Apache<\/h4>\n\n\n\n<div class=\"qubely-block-accordion  qubely-block-d34844\" data-item-toggle=\"true\">\n<div class=\"wp-block-qubely-accordion-item qubely-block-3e39e1\"><div class=\"qubely-accordion-item qubely-type-fill qubely-accordion-active\"><div class=\"qubely-accordion-panel qubely-icon-position-right\"><span class=\"qubely-accordion-panel-handler\" role=\"button\"><span class=\"qubely-accordion-panel-handler-label\">3. \u00c9tat des lieux des emplacements de fichiers Apache<\/span><span class=\"qubely-accordion-icon fa fa-plus\"><\/span><\/span><\/div><div class=\"qubely-accordion-body\" style=\"display:block\"><div itemprop=\"text\">\n<p>Sous Debian, la localisation de la page du document racine se trouve dans le r\u00e9pertoire \/var\/www\/html et s&rsquo;appelle index.html. On peut voir son contenu en ex\u00e9cutant cette commande :<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">ls -la \/var\/www\/html<\/pre><\/div>\n\n\n\n<p>Notez que les r\u00e9pertoires et les fichiers index.html appartiennent \u00e0 l&rsquo;utilisateur root.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" loading=\"lazy\" width=\"801\" height=\"121\" src=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-03.png\" alt=\"\" class=\"wp-image-2223\" srcset=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-03.png 801w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-03-300x45.png 300w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-03-768x116.png 768w\" sizes=\"(max-width: 801px) 100vw, 801px\" \/><\/figure>\n\n\n\n<p>Sous Debian, tous les fichiers Apache sont dans le dossier \/etc\/apache2 :<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">ls -la \/etc\/apache2<\/pre><\/div>\n\n\n\n<p>Les r\u00e9pertoires des sites disponibles et des sites activ\u00e9s contiennent des informations sur les sites existants et sur les sites autoris\u00e9s \u00e0 \u00eatre accessibles sur Internet.<\/p>\n\n\n\n<p>Le fichier \/etc\/apache2\/sites-enabled\/000-default.conf est un lien symbolique vers le fichier du m\u00eame nom dans le dossier sites-available. Ce lien permet \u00e0 Apache de lire le contenu du fichier \u00ab\u00a0\/etc\/apache2\/sites-available\/000-default.conf\u00a0\u00bb et l&rsquo;envoyer au navigateur. En ajoutant d&rsquo;autres fichiers de configuration dans \/etc\/apache2\/sites-available et en cr\u00e9ant les liens symboliques correspondants dans \/etc\/apache2\/sites-enabled, nous pouvons \u00e9tablir les pages appartenant aux diff\u00e9rents domaines. C&rsquo;est ainsi que nous pouvons h\u00e9berger plusieurs sites ind\u00e9pendants \u00e0 partir d&rsquo;une m\u00eame adresse IP.<\/p>\n<\/div><\/div><\/div><\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group has-border-color has-vivid-cyan-blue-border-color has-background is-layout-flow\" style=\"border-style:dotted;border-width:2px;border-radius:8px;background-color:#fffdf8;padding-right:7px;padding-bottom:15px;padding-left:7px\">\n<h4 class=\"has-text-color wp-block-heading\" id=\"3-iii-cr%C3%A9ation-dun-admin-pour-phpmyadmin\" style=\"color:#fffdf8;margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0;font-size:1px\">Cr\u00e9ation d&rsquo;une structure de fichiers pour les h\u00f4tes virtuels<\/h4>\n\n\n\n<div class=\"qubely-block-accordion  qubely-block-d34844\" data-item-toggle=\"true\">\n<div class=\"wp-block-qubely-accordion-item qubely-block-d9a86c\"><div class=\"qubely-accordion-item qubely-type-fill qubely-accordion-active\"><div class=\"qubely-accordion-panel qubely-icon-position-right\"><span class=\"qubely-accordion-panel-handler\" role=\"button\"><span class=\"qubely-accordion-panel-handler-label\">4. Cr\u00e9ation d&rsquo;une structure de fichiers pour les h\u00f4tes virtuels<\/span><span class=\"qubely-accordion-icon fa fa-plus\"><\/span><\/span><\/div><div class=\"qubely-accordion-body\" style=\"display:block\"><div itemprop=\"text\">\n<p>Nous allons maintenant cr\u00e9er les r\u00e9pertoires des deux sites annexes. Les deux sites sont tr\u00e8s sommaires et disposerons d&rsquo;une page \u00ab\u00a0index.html\u00a0\u00bb et d&rsquo;un sous-dossier devant contenir des \u00e9ventuelles images.<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">robert@vmi8:\/var\/www$ sudo mkdir projets\n\nrobert@vmi8:\/var\/www$ sudo mkdir -p \/var\/www\/projets\/01-test-vhost\/site1\/{public_html,image}\nrobert@vmi8:\/var\/www$ sudo mkdir -p \/var\/www\/projets\/01-test-vhost\/site2\/{public_html,image}<\/pre><\/div>\n\n\n\n<p>On obtient la nouvelle structure de fichier \/ r\u00e9pertoire.<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">robert@vmi8:\/var\/www\/projets$ ll \/var\/www\/projets\/01-test-vhost\/site1\ntotal 14\ndrwxr-xr-x 7 root root 4096 Dec 29 20:33 .\/\ndrwxr-xr-x 2 root root 4096 Dec 29 20:34 ..\/\ndrwxr-xr-x 2 root root 4096 Dec 29 20:33 image\/\ndrwxr-xr-x 2 root root 4096 Dec 29 20:33 public_html\/<\/pre><\/div>\n\n\n\n<p>Dans l&rsquo;image ci-dessus, nous voyons que l&rsquo;utilisateur root poss\u00e8de toujours le dossier public_html, \u00e0 partir duquel nos fichiers publics seront distribu\u00e9s sur Internet. Nous allons maintenant changer la propri\u00e9t\u00e9 afin que notre utilisateur simple puisse acc\u00e9der aux fichiers public_html. Les commandes sont les suivantes :<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">sudo chown -vR robert:robert \/var\/www\/projets\/01-test-vhost\/site1\/public_html\nsudo chown -vR robert:robert \/var\/www\/projets\/01-test-vhost\/site2\/public_html<\/pre><\/div>\n\n\n\n<p>On s&rsquo;assure \u00e9galement que les fichiers du r\u00e9pertoire \/var\/www et ses sous-dossiers puissent \u00eatre accessibles en lecture.<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">sudo chmod -R 755 \/var\/www\/projets<\/pre><\/div>\n<\/div><\/div><\/div><\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group has-border-color has-vivid-cyan-blue-border-color has-background is-layout-flow\" style=\"border-style:dotted;border-width:2px;border-radius:8px;background-color:#fffdf8;padding-right:7px;padding-bottom:15px;padding-left:7px\">\n<h4 class=\"has-text-color wp-block-heading\" id=\"3-iii-cr%C3%A9ation-dun-admin-pour-phpmyadmin\" style=\"color:#fffdf8;margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0;font-size:1px\">Cr\u00e9ation des pages \u00ab\u00a0index.html\u00a0\u00bb pour nos sites de d\u00e9monstration<\/h4>\n\n\n\n<div class=\"qubely-block-accordion  qubely-block-d34844\" data-item-toggle=\"true\">\n<div class=\"wp-block-qubely-accordion-item qubely-block-0d48e2\"><div class=\"qubely-accordion-item qubely-type-fill qubely-accordion-active\"><div class=\"qubely-accordion-panel qubely-icon-position-right\"><span class=\"qubely-accordion-panel-handler\" role=\"button\"><span class=\"qubely-accordion-panel-handler-label\">5. Cr\u00e9ation des pages \u00ab\u00a0index.html\u00a0\u00bb pour nos sites de d\u00e9monstration<\/span><span class=\"qubely-accordion-icon fa fa-plus\"><\/span><\/span><\/div><div class=\"qubely-accordion-body\" style=\"display:block\"><div itemprop=\"text\">\n<p>Nos fichiers publics seront dans \/var\/www\/projets\/01-test-vhost\/site1\/public.html et \/var\/www\/projets\/01-test-vhost\/site2\/public.html. Nous allons maintenant cr\u00e9er un fichier \u00ab\u00a0index.html\u00a0\u00bb dans chacun de ces deux dossiers afin d&rsquo;afficher du contenu pendant la navigation. En utilisant nano, nous allons maintenant cr\u00e9er \u00ab\u00a0index.html\u00a0\u00bb pour site1 :<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">sudo nano \/var\/www\/projets\/01-test-vhost\/site1\/public_html\/index.html\n<\/pre><\/div>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;htmlmixed&quot;,&quot;mime&quot;:&quot;text\/html&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;HTML&quot;,&quot;modeName&quot;:&quot;html&quot;}\">&lt;!DOCTYPE HTML PUBLIC &quot;-\/\/W3C\/\/DTD HTML 4.01 Transitional\/\/EN&quot;\n&quot;http:\/\/www.w3.org\/TR\/html4\/loose.dtd&quot;&gt;\n&lt;html&gt;\n&lt;head&gt;\n\t&lt;title&gt;BIENVENU SUR MON SITE 1&lt;\/title&gt;\n\t&lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text\/html; charset=iso-8859-1&quot;&gt;\n\t&lt;style type=&quot;text\/css&quot;&gt;\n\t\tbody,td,th {\n   \t\t\tcolor: #FF3333;\n\t\t}\n\t&lt;\/style&gt;\n&lt;\/head&gt;\n&lt;body&gt;\n\t&lt;h1&gt;Contenu du site num 1&lt;\/h1&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;<\/pre><\/div>\n\n\n\n<p>De m\u00eame, on cr\u00e9er le fichier \u00ab\u00a0index.html\u00a0\u00bb du site exemlple site2<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">sudo nano \/var\/www\/projets\/01-test-vhost\/site2\/public_html\/index.html\n<\/pre><\/div>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;htmlmixed&quot;,&quot;mime&quot;:&quot;text\/html&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;HTML&quot;,&quot;modeName&quot;:&quot;html&quot;}\">&lt;!DOCTYPE HTML PUBLIC &quot;-\/\/W3C\/\/DTD HTML 4.01 Transitional\/\/EN&quot;\n&quot;http:\/\/www.w3.org\/TR\/html4\/loose.dtd&quot;&gt;\n&lt;html&gt;\n&lt;head&gt;\n\t&lt;title&gt;BIENVENU SUR MON SITE 2&lt;\/title&gt;\n\t&lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text\/html; charset=iso-8859-1&quot;&gt;\n\t&lt;style type=&quot;text\/css&quot;&gt;\n\t\tbody,td,th {\n   \t\t\tcolor: #FF3333;\n\t\t}\n\t&lt;\/style&gt;\n&lt;\/head&gt;\n&lt;body&gt;\n\t&lt;h1&gt;Contenu du site num 2&lt;\/h1&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;<\/pre><\/div>\n<\/div><\/div><\/div><\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group has-border-color has-vivid-cyan-blue-border-color has-background is-layout-flow\" style=\"border-style:dotted;border-width:2px;border-radius:8px;background-color:#fffdf8;padding-right:7px;padding-bottom:15px;padding-left:7px\">\n<h4 class=\"has-text-color wp-block-heading\" id=\"3-iii-cr%C3%A9ation-dun-admin-pour-phpmyadmin\" style=\"color:#fffdf8;margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0;font-size:1px\">Cr\u00e9ation des fichiers de configuration des h\u00f4tes virtuels<\/h4>\n\n\n\n<div class=\"qubely-block-accordion  qubely-block-d34844\" data-item-toggle=\"true\">\n<div class=\"wp-block-qubely-accordion-item qubely-block-76732b\"><div class=\"qubely-accordion-item qubely-type-fill qubely-accordion-active\"><div class=\"qubely-accordion-panel qubely-icon-position-right\"><span class=\"qubely-accordion-panel-handler\" role=\"button\"><span class=\"qubely-accordion-panel-handler-label\">6. Cr\u00e9ation des fichiers de configuration des h\u00f4tes virtuels<\/span><span class=\"qubely-accordion-icon fa fa-plus\"><\/span><\/span><\/div><div class=\"qubely-accordion-body\" style=\"display:block\"><div itemprop=\"text\">\n<p>Un h\u00f4te virtuel est une identit\u00e9 (suppl\u00e9mentaire) assum\u00e9e par le serveur web. Le Serveur HTTP Apache2 est capable de g\u00e9rer simultan\u00e9ment plusieurs arborescences Web gr\u00e2ce \u00e0 la notion Virtual Hosts (h\u00f4tes virtuels).<\/p>\n\n\n\n<p>Apache distingue deux types d\u2019h\u00f4tes virtuels :<\/p>\n\n\n\n<ul>\n<li>ceux qui se basent sur l\u2019adresse IP : cette m\u00e9thode n\u00e9cessite une adresse IP di\ufb00\u00e9rente pour chaque site ;<\/li>\n\n\n\n<li>ceux qui reposent sur le nom DNS du serveur web : celle-ci n\u2019emploie qu\u2019une adresse IP et di\ufb00\u00e9rencie les sites par le nom d\u2019h\u00f4te communiqu\u00e9 par le client HTTP.<\/li>\n<\/ul>\n\n\n\n<p>La con\ufb01guration par d\u00e9faut d\u2019Apache 2 a d\u00e9j\u00e0 activ\u00e9 les h\u00f4tes virtuels bas\u00e9s sur le nom gr\u00e2ce \u00e0 la directive NameVirtualHost du \ufb01chier \/etc\/apache2\/sites-enabled\/000-default. Ce \ufb01chier d\u00e9crit en outre un h\u00f4te virtuel par d\u00e9faut qui sera employ\u00e9 si aucun h\u00f4te virtuel correspondant n\u2019existe.<\/p>\n\n\n\n<p>Informons maintenant Apache qu&rsquo;il y a deux nouveaux sites \u00e0 desservir. Nous allons copier deux fois le fichier d&rsquo;h\u00f4te virtuel par d\u00e9faut, 000-default.conf, puis modifier ces nouveaux fichiers pour les adapter a notre convenance.<\/p>\n\n\n\n<h5 class=\"has-text-color wp-block-heading\" id=\"5-iii-cr%C3%A9ation-dun-admin-pour-phpmyadmin\" style=\"color:#fffdf8;margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0;font-size:1px\">Cr\u00e9ation du fichier VirtualHost du site 1<\/h5>\n\n\n\n<div class=\"wp-block-uagb-advanced-heading uagb-block-2c2a414e\"><h3 class=\"uagb-heading-text\">6.1. Cr\u00e9ation du fichier VirtualHost du site 1<\/h3><\/div>\n\n\n\n<p>Utilisons nano pour voir ce que contient de fichier \u00ab\u00a0site1.conf\u00a0\u00bb :<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">sudo cp \/etc\/apache2\/sites-available\/000-default.conf \/etc\/apache2\/sites-available\/site1.conf<\/pre><\/div>\n\n\n\n<p>Pour plus de clart\u00e9, nous allons supprimer les commentaires et voici ce que l&rsquo;on devrait retourner avec nano :<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;javascript&quot;,&quot;mime&quot;:&quot;application\/json&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;JSON&quot;,&quot;modeName&quot;:&quot;json&quot;}\">&lt;VirtualHost *:80&gt;\n    ServerAdmin admin@webodesign.com\n    ServerName site1.webodesign.net\n    ServerAlias www.site1.net\n    DocumentRoot \/var\/www\/projets\/01-test-vhost\/site1\/public_html\n    ErrorLog ${APACHE_LOG_DIR}\/error.log\n    CustomLog ${APACHE_LOG_DIR}\/access.log combined\n&lt;\/VirtualHost&gt;<\/pre><\/div>\n\n\n\n<ul>\n<li>80 : Cet h\u00f4te virtuel \u00e9coutera sur le port 80. Vous pouvez modifier le num\u00e9ro de port via le fichier ports.conf.<\/li>\n\n\n\n<li>ServerAdmin : Il s&rsquo;agit de l&rsquo;adresse e-mail \u00e0 laquelle Apache enverra des messages \u00e0 l&rsquo;administrateur en cas d&rsquo;erreur dans le syst\u00e8me. Peut \u00eatre omis.<\/li>\n\n\n\n<li>ServerName : le nom du serveur, \u00e9videmment, doit co\u00efncider avec le nom de domaine.<\/li>\n\n\n\n<li>ServerAlias : autre nom pour le m\u00eame serveur que ci-dessus. Vous pouvez avoir autant de d&rsquo;alias que vous le souhaitez.<\/li>\n\n\n\n<li>DocumentRoot : pointe vers l&rsquo;adresse absolue du site sur le disque.<\/li>\n\n\n\n<li>ErrorLog : adresse du journal des erreurs.<\/li>\n\n\n\n<li>CustomLog : journal des erreurs d&rsquo;Apache pour la consignation des acc\u00e8s \u00e0 l&rsquo;application<\/li>\n<\/ul>\n\n\n\n<h5 class=\"has-text-color wp-block-heading\" id=\"5-iii-cr%C3%A9ation-dun-admin-pour-phpmyadmin\" style=\"color:#fffdf8;margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0;font-size:1px\">Cr\u00e9ation du fichier VirtualHost du site 2<\/h5>\n\n\n\n<div class=\"wp-block-uagb-advanced-heading uagb-block-e9774359\"><h3 class=\"uagb-heading-text\">6.2. Cr\u00e9ation du fichier VirtualHost du site 2<\/h3><\/div>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">sudo cp \/etc\/apache2\/sites-available\/000-default.conf \/etc\/apache2\/sites-available\/site2.conf\nsudo nano \/etc\/apache2\/sites-available\/site2.conf<\/pre><\/div>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;javascript&quot;,&quot;mime&quot;:&quot;application\/json&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;JSON&quot;,&quot;modeName&quot;:&quot;json&quot;}\">&lt;VirtualHost *:80&gt;\n    ServerAdmin admin@webodesign.com\n    ServerName site2.webodesign.net\n    ServerAlias www.site2.net\n    DocumentRoot \/var\/www\/projets\/01-test-vhost\/site2\/public_html\n    ErrorLog ${APACHE_LOG_DIR}\/error.log\n    CustomLog ${APACHE_LOG_DIR}\/access.log combined\n&lt;\/VirtualHost&gt;<\/pre><\/div>\n<\/div><\/div><\/div><\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group has-border-color has-vivid-cyan-blue-border-color has-background is-layout-flow\" style=\"border-style:dotted;border-width:2px;border-radius:8px;background-color:#fffdf8;padding-right:7px;padding-bottom:15px;padding-left:7px\">\n<h4 class=\"has-text-color wp-block-heading\" id=\"3-iii-cr%C3%A9ation-dun-admin-pour-phpmyadmin\" style=\"color:#fffdf8;margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0;font-size:1px\">Activation des nouveaux fichiers d&rsquo;h\u00f4te virtuel<\/h4>\n\n\n\n<div class=\"qubely-block-accordion  qubely-block-d34844\" data-item-toggle=\"true\">\n<div class=\"wp-block-qubely-accordion-item qubely-block-afe3ce\"><div class=\"qubely-accordion-item qubely-type-fill qubely-accordion-active\"><div class=\"qubely-accordion-panel qubely-icon-position-right\"><span class=\"qubely-accordion-panel-handler\" role=\"button\"><span class=\"qubely-accordion-panel-handler-label\">7. Activation des nouveaux fichiers d&rsquo;h\u00f4te virtuel<\/span><span class=\"qubely-accordion-icon fa fa-plus\"><\/span><\/span><\/div><div class=\"qubely-accordion-body\" style=\"display:block\"><div itemprop=\"text\">\n<p>La commande a2ensite cr\u00e9era des liens symboliques \u00e0 partir du r\u00e9pertoire activ\u00e9 vers les sites disponibles, de sorte qu&rsquo;Apache commencera \u00e0 servir les h\u00f4tes virtuels. Les commandes sont les suivantes :<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">sudo a2ensite site1.conf\nsudo a2ensite site2.conf<\/pre><\/div>\n\n\n\n<p>Si vous souhaitez d\u00e9sactiver le site par d\u00e9faut, la commande est la suivante :<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">sudo a2dissite 000-default.conf<\/pre><\/div>\n\n\n\n<p>Vous pouvez le laisser tel quel dans le cas o\u00f9 quelqu&rsquo;un entre l&rsquo;adresse IP directement dans le navigateur &#8211; alors l&rsquo;index par d\u00e9faut, index.html sera activ\u00e9 et le visiteur verra ce que vous avez d\u00e9cid\u00e9 de coder.<\/p>\n\n\n\n<p>Une fois que vous avez utilis\u00e9 les commandes a2ensite et a2dissite, vous pouvez voir quelque chose comme ceci dans la fen\u00eatre du terminal :<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">robert@vmi8:\/var\/www\/projets$ sudo a2dissite 000-default.conf\nSite 000-default disabled.\nTo activate the new configuration, you need to run:\nsystemctl reload apache2\nrobert@vmi8:\/var\/www\/projets$ sudo a2ensite site1.conf\nEnabling site site1.\nTo activate the new configuration, you need to run:\nsystemctl reload apache2\nrobert@vmi8:\/var\/www\/projets$ sudo a2ensite site2.conf\nEnabling site site2.\nTo activate the new configuration, you need to run:\nsystemctl reload apache2\nrobert@vmi8:\/var\/www\/projets$ sudo systemctl reload apache2\n# ou\nrobert@vmi8:\/var\/www\/projets$ sudo service apache2 reload<\/pre><\/div>\n<\/div><\/div><\/div><\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group has-border-color has-vivid-cyan-blue-border-color has-background is-layout-flow\" style=\"border-style:dotted;border-width:2px;border-radius:8px;background-color:#fffdf8;padding-right:7px;padding-bottom:15px;padding-left:7px\">\n<h4 class=\"has-text-color wp-block-heading\" id=\"3-iii-cr%C3%A9ation-dun-admin-pour-phpmyadmin\" style=\"color:#fffdf8;margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0;font-size:1px\">Test de la configuration pour une \u00e9coute sur le port 80<\/h4>\n\n\n\n<div class=\"qubely-block-accordion  qubely-block-d34844\" data-item-toggle=\"true\">\n<div class=\"wp-block-qubely-accordion-item qubely-block-e62064\"><div class=\"qubely-accordion-item qubely-type-fill qubely-accordion-active\"><div class=\"qubely-accordion-panel qubely-icon-position-right\"><span class=\"qubely-accordion-panel-handler\" role=\"button\"><span class=\"qubely-accordion-panel-handler-label\">8. Test de la configuration pour une \u00e9coute sur le port 80<\/span><span class=\"qubely-accordion-icon fa fa-plus\"><\/span><\/span><\/div><div class=\"qubely-accordion-body\" style=\"display:block\"><div itemprop=\"text\">\n<p><\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\"><\/pre><\/div>\n<\/div><\/div><\/div><\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group has-border-color has-vivid-cyan-blue-border-color has-background is-layout-flow\" style=\"border-style:dotted;border-width:2px;border-radius:8px;background-color:#fffdf8;padding-right:7px;padding-bottom:15px;padding-left:7px\">\n<h4 class=\"has-text-color wp-block-heading\" id=\"3-iii-cr%C3%A9ation-dun-admin-pour-phpmyadmin\" style=\"color:#fffdf8;margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0;font-size:1px\">S\u00e9curisation des domaines avec les certificats Let\u2019s Encrypt TLS<\/h4>\n\n\n\n<div class=\"qubely-block-accordion  qubely-block-d34844\" data-item-toggle=\"true\">\n<div class=\"wp-block-qubely-accordion-item qubely-block-87b153\"><div class=\"qubely-accordion-item qubely-type-fill qubely-accordion-active\"><div class=\"qubely-accordion-panel qubely-icon-position-right\"><span class=\"qubely-accordion-panel-handler\" role=\"button\"><span class=\"qubely-accordion-panel-handler-label\">9. S\u00e9curisation des domaines avec les certificats Let\u2019s Encrypt TLS<\/span><span class=\"qubely-accordion-icon fa fa-plus\"><\/span><\/span><\/div><div class=\"qubely-accordion-body\" style=\"display:block\"><div itemprop=\"text\">\n<p>Nous allons utiliser des certificats gratuits pour transformer notre trafic HTTP en trafic HTTPS, ce qui rendra la connexion au site s\u00e9curis\u00e9e.<\/p>\n\n\n\n<p>Certbot pour Debian provient du repo Backports, alors nous cr\u00e9ons une liste de sources pour notre cas :<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">sudo nano \/etc\/apt\/sources.list.d\/apache.list<\/pre><\/div>\n\n\n\n<p>et entrez la ligne suivante dans ce fichier :<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">deb http:\/\/deb.debian.org\/debian stretch-backports main<\/pre><\/div>\n\n\n\n<p>Sauvegarde le fichier avec les combinaisons de touches [Ctrl+o], Retour, [Ctrl+x].<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">sudo apt update<\/pre><\/div>\n\n\n\n<p>et installez les backports :<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">sudo apt-get install certbot python-certbot-apache -t stretch-backports<\/pre><\/div>\n\n\n\n<p>Enfin, ex\u00e9cutez Certbot :<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">sudo certbot --apache<\/pre><\/div>\n\n\n\n<p>Il sera demand\u00e9 une adresse e-mail en cas d&rsquo;urgence, puis deux autres questions facultatives auxquelles on peut r\u00e9pondre et ensuite la question la plus importante &#8211; pour quels noms souhaite t&rsquo;on activer HTTPS ?<\/p>\n\n\n\n<p>J&rsquo;ai choisi 4 et 5 car ce sont les seuls domaines et sous-domaines r\u00e9els pour lesquels j&rsquo;ai configur\u00e9 DNS :<\/p>\n\n\n\n<p>Voici le d\u00e9roul\u00e9 du param\u00e9trage.<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">robert@vmi8:\/etc\/apache2\/sites-available$ sudo certbot --apache\nSaving debug log to \/var\/log\/letsencrypt\/letsencrypt.log\nPlugins selected: Authenticator apache, Installer apache\n\nWhich names would you like to activate HTTPS for?\n- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -\n1: site1.webodesign.net\n2: www.site1.webodesign.net\n3: site2.webodesign.net\n4: www.site2.webodesign.net\n5: www.webodesign.net\n- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -\nSelect the appropriate numbers separated by commas and\/or spaces, or leave input\nblank to select all options shown (Enter 'c' to cancel): 1\nRequesting a certificate for site1.webodesign.net\nPerforming the following challenges:\nhttp-01 challenge for site1.webodesign.net\nWaiting for verification...\nCleaning up challenges\nCreated an SSL vhost at \/etc\/apache2\/sites-available\/site1-le-ssl.conf\nDeploying Certificate to VirtualHost \/etc\/apache2\/sites-available\/site1-le-ssl.conf\nEnabling available site: \/etc\/apache2\/sites-available\/site1-le-ssl.conf\nRedirecting vhost in \/etc\/apache2\/sites-enabled\/site1.conf to ssl vhost in \/etc\/apache2\/sites-available\/site1-le-ssl.conf\n\n- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -\nCongratulations! You have successfully enabled https:\/\/site1.webodesign.net\n- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -\n\nIMPORTANT NOTES:\n - Congratulations! Your certificate and chain have been saved at:\n   \/etc\/letsencrypt\/live\/site1.webodesign.net\/fullchain.pem\n   Your key file has been saved at:\n   \/etc\/letsencrypt\/live\/site1.webodesign.net\/privkey.pem\n   Your certificate will expire on 2023-04-01. To obtain a new or\n   tweaked version of this certificate in the future, simply run\n   certbot again with the &quot;certonly&quot; option. To non-interactively\n   renew *all* of your certificates, run &quot;certbot renew&quot;\n - If you like Certbot, please consider supporting our work by:\n\n   Donating to ISRG \/ Let's Encrypt:   https:\/\/letsencrypt.org\/donate\n   Donating to EFF:                    https:\/\/eff.org\/donate-le<\/pre><\/div>\n\n\n\n<p>On red\u00e9marre Apache<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;shell&quot;,&quot;mime&quot;:&quot;text\/x-sh&quot;,&quot;theme&quot;:&quot;material&quot;,&quot;lineNumbers&quot;:false,&quot;styleActiveLine&quot;:false,&quot;lineWrapping&quot;:false,&quot;readOnly&quot;:true,&quot;languageLabel&quot;:&quot;no&quot;,&quot;language&quot;:&quot;Shell&quot;,&quot;modeName&quot;:&quot;shell&quot;}\">sudo service apache2 restart<\/pre><\/div>\n\n\n\n<p>Voici le r\u00e9sultat :<\/p>\n\n\n\n<p><\/p>\n<\/div><\/div><\/div><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column uag-hide-tab uag-hide-mob is-layout-flow\" style=\"flex-basis:170px\">\n\n<div class=\"cleanlogin-container\">\t\t\n\n\t<form class=\"cleanlogin-form\" method=\"post\" action=\"https:\/\/www.webodesign.net\/?page_id=2385\" onsubmit=\"submit.disabled = true; return true;\">\n\t\t\t\n\t\t<fieldset>\n\n\t\t\t\t\t\t<div class=\"cleanlogin-field\">\n                <label for=\"log\">Identifiant<\/label>\n\t\t\t\t<input class=\"cleanlogin-field-username\" type=\"text\" name=\"log\" placeholder=\"Identifiant\" aria-label=\"Identifiant\">\n\t\t\t<\/div>\n\t\t\t\n\t\t\t<div class=\"cleanlogin-field\">\n                <label for=\"pwd\">Mot de passe<\/label>\n\t\t\t\t<input class=\"cleanlogin-field-password\" type=\"password\" id=\"pwd\" name=\"pwd\" placeholder=\"Mot de passe\" aria-label=\"Mot de passe\">\n                <i class=\"bi bi-eye-slash\" id=\"togglePassword\"><\/i>\n\t\t\t<\/div>\n\n\t\t\t\t\t\n\t\t\t<input type=\"hidden\" name=\"clean_login_wpnonce\" value=\"e994c14fba\">\n            \n\t\t\t\t\t<\/fieldset>\n\t\t\n\t\t<fieldset>\n\t\t\t<input class=\"cleanlogin-field\" type=\"submit\" value=\"Se connecter\" name=\"submit\">\n\t\t\t<input type=\"hidden\" name=\"action\" value=\"login\">\n\t\t\t\n\t\t\t<div class=\"cleanlogin-field cleanlogin-field-remember\">\n\t\t\t\t<input type=\"checkbox\" id=\"rememberme\" name=\"rememberme\" value=\"forever\">\n\t\t\t\t<label for=\"rememberme\">Se souvenir de moi\u00a0?<\/label>\n\t\t\t<\/div>\n\t\t<\/fieldset>\n\n\t\t\n\t\t<div class=\"cleanlogin-form-bottom\">\n\t\t\t\n            \n\t\t\t\t\t\t\t\t\t\n\t\t<\/div>\n\t\t\n\t<\/form>\n\n<\/div>\n\n<script>\nconst togglePassword = document.querySelector('#togglePassword');\nconst password = document.querySelector('#pwd');\n\ntogglePassword.addEventListener('click', function (e) {\n    const type = password.getAttribute('type') === 'password' ? 'text' : 'password';\n    password.setAttribute('type', type);\n    this.classList.toggle('bi-eye');\n});\n<\/script>\n<\/div>\n<\/div>\n<\/div><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Dans ce TP, nous commencerons avec un VPS avec un Debian 11 fra\u00eechement install\u00e9 et nous finirons avec trois sites diff\u00e9rents partageant la m\u00eame adresse IP, h\u00e9berg\u00e9s sur la m\u00eame machine.<\/p>\n<p>Les th\u00e8mes abord\u00e9 dans cet exercice seront, l&rsquo;Installation d&rsquo;Apache, la d\u00e9finition des emplacements de fichiers pour la page Apache par d\u00e9faut, la cr\u00e9ation d&rsquo;une structure de fichiers pour les h\u00f4tes virtuels, la cr\u00e9ation des pages index.html pour nos sites de d\u00e9monstration, la cr\u00e9ation de fichiers d&rsquo;h\u00f4tes virtuels, l&rsquo;activation des nouveaux fichiers d&rsquo;h\u00f4te virtuel, le test des h\u00f4tes virtuels en http, et enfin la s\u00e9curisation des domaines avec les certificats Let\u2019s Encrypt TLS.<\/p>\n","protected":false},"author":3,"featured_media":2219,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"qubely_global_settings":"","qubely_interactions":"","_uag_custom_page_level_css":""},"categories":[18,21],"tags":[],"qubely_featured_image_url":{"full":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00.jpg",940,490,false],"landscape":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00.jpg",940,490,false],"portraits":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00-540x320.jpg",540,320,true],"thumbnail":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00-150x150.jpg",150,150,true],"medium":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00-300x156.jpg",300,156,true],"medium_large":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00-768x400.jpg",768,400,true],"large":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00.jpg",940,490,false],"1536x1536":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00.jpg",940,490,false],"2048x2048":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00.jpg",940,490,false],"qubely_landscape":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00.jpg",940,490,false],"qubely_portrait":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00-540x320.jpg",540,320,true],"qubely_thumbnail":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00-140x100.jpg",140,100,true]},"qubely_author":{"display_name":"R\u00e9mi","author_link":"https:\/\/www.webodesign.net\/?author=3"},"qubely_comment":0,"qubely_category":"<a href=\"https:\/\/www.webodesign.net\/?cat=18\" rel=\"category\">Formations<\/a> <a href=\"https:\/\/www.webodesign.net\/?cat=21\" rel=\"category\">Formations Linux<\/a>","qubely_excerpt":"Dans ce TP, nous commencerons avec un VPS avec un Debian 11 fra\u00eechement install\u00e9 et nous finirons avec trois sites diff\u00e9rents partageant la m\u00eame adresse IP, h\u00e9berg\u00e9s sur la m\u00eame machine. Les th\u00e8mes abord\u00e9 dans cet exercice seront, l'Installation d'Apache, la d\u00e9finition des emplacements de fichiers pour la page Apache par d\u00e9faut, la cr\u00e9ation d'une\u2026","uagb_featured_image_src":{"full":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00.jpg",940,490,false],"thumbnail":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00-150x150.jpg",150,150,true],"medium":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00-300x156.jpg",300,156,true],"medium_large":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00-768x400.jpg",768,400,true],"large":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00.jpg",940,490,false],"1536x1536":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00.jpg",940,490,false],"2048x2048":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00.jpg",940,490,false],"qubely_landscape":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00.jpg",940,490,false],"qubely_portrait":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00-540x320.jpg",540,320,true],"qubely_thumbnail":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2023\/01\/virtualhost-subdomains-00-140x100.jpg",140,100,true]},"uagb_author_info":{"display_name":"R\u00e9mi","author_link":"https:\/\/www.webodesign.net\/?author=3"},"uagb_comment_info":0,"uagb_excerpt":"Dans ce TP, nous commencerons avec un VPS avec un Debian 11 fra\u00eechement install\u00e9 et nous finirons avec trois sites diff\u00e9rents partageant la m\u00eame adresse IP, h\u00e9berg\u00e9s sur la m\u00eame machine. Les th\u00e8mes abord\u00e9 dans cet exercice seront, l'Installation d'Apache, la d\u00e9finition des emplacements de fichiers pour la page Apache par d\u00e9faut, la cr\u00e9ation d'une\u2026","_links":{"self":[{"href":"https:\/\/www.webodesign.net\/index.php?rest_route=\/wp\/v2\/posts\/2218"}],"collection":[{"href":"https:\/\/www.webodesign.net\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.webodesign.net\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.webodesign.net\/index.php?rest_route=\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.webodesign.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2218"}],"version-history":[{"count":13,"href":"https:\/\/www.webodesign.net\/index.php?rest_route=\/wp\/v2\/posts\/2218\/revisions"}],"predecessor-version":[{"id":2760,"href":"https:\/\/www.webodesign.net\/index.php?rest_route=\/wp\/v2\/posts\/2218\/revisions\/2760"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.webodesign.net\/index.php?rest_route=\/wp\/v2\/media\/2219"}],"wp:attachment":[{"href":"https:\/\/www.webodesign.net\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2218"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.webodesign.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2218"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.webodesign.net\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2218"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}