{"id":1725,"date":"2022-12-06T16:13:11","date_gmt":"2022-12-06T15:13:11","guid":{"rendered":"https:\/\/www.webodesign.net\/?p=1725"},"modified":"2023-02-09T21:58:03","modified_gmt":"2023-02-09T20:58:03","slug":"htaccess-presentation","status":"publish","type":"post","link":"https:\/\/www.webodesign.net\/?p=1725","title":{"rendered":"Htaccess &#8211; Pr\u00e9sentation"},"content":{"rendered":"\n<div class=\"wp-block-uagb-container uagb-block-63e2c005 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-5d73c6c3     \"\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=\"#affichage-dune-page-derreur-personnalis\u00e9e\" class=\"uagb-toc-link__trigger\">Affichage d\u2019une page d\u2019erreur personnalis\u00e9e<\/a><li class=\"uagb-toc__list\"><a href=\"#redirection-de-fichier\" class=\"uagb-toc-link__trigger\">Redirection de fichier<\/a><li class=\"uagb-toc__list\"><a href=\"#remplacement-des-commandes\" class=\"uagb-toc-link__trigger\">Remplacement des commandes<\/a><li class=\"uagb-toc__list\"><a href=\"#protection-htaccess-par-authentification\" class=\"uagb-toc-link__trigger\">Protection htaccess par authentification<\/a><li class=\"uagb-toc__list\"><a href=\"#r\u00e9\u00e9criture-durl-url-rewriting\" class=\"uagb-toc-link__trigger\">R\u00e9\u00e9criture d&#039;url (url rewriting)<\/a><\/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<div class=\"qubely-block-accordion  qubely-block-d34844\" data-item-toggle=\"true\">\n<div class=\"wp-block-qubely-accordion-item qubely-block-fa8b93\"><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\">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<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<p>On peut l\u2019utiliser des fichiers Htaccess pour prot\u00e9ger une partie du site en n\u2019autorisant l\u2019acc\u00e8s qu\u2019\u00e0 des utilisateurs d\u00e9clar\u00e9s, cr\u00e9er des pages d\u2019erreurs personnalis\u00e9es, modifier des url, rediriger des visiteurs vers une autre page.<\/p>\n\n\n\n<p class=\"has-vivid-cyan-blue-color has-text-color\"><strong>Port\u00e9e de son fonctionnement&nbsp;:<\/strong><\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-4\" style=\"margin-bottom:0;padding-bottom:0\">\n<div class=\"wp-block-column is-layout-flow\">\n<p>Un fichier htaccess plac\u00e9 dans un r\u00e9pertoire du site agit \u00e0 l\u2019int\u00e9rieur de se dossier mais \u00e9galement dans tous les sous-r\u00e9pertoires contenus dans le dossier en question.<\/p>\n\n\n\n<p>Si dans un sous-dossier il existe un fichier htaccess qui propose d\u2019autres commandes, alors le contenu de ce fichier htaccess viendra s\u2019ajouter \u00e0 celui de son(ses) parent(s) (Addition des commandes).<\/p>\n\n\n\n<p>Par contre, si une r\u00e8gle dans le r\u00e9pertoire enfant contredit celle dict\u00e9e dans un dossier parent, alors la r\u00e8gle prise en compte sera celle de l\u2019enfant. Par contre la r\u00e8gle du parent, dans son r\u00e9pertoire sera conserv\u00e9e dans le contexte parent.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-constrained wp-container-3\" style=\"flex-basis:30%\">\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" loading=\"lazy\" width=\"960\" height=\"658\" src=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-01.jpg\" alt=\"\" class=\"wp-image-1729\" srcset=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-01.jpg 960w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-01-300x206.jpg 300w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-01-768x526.jpg 768w\" sizes=\"(max-width: 960px) 100vw, 960px\" \/><\/figure>\n<\/div>\n<\/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<div class=\"qubely-block-accordion  qubely-block-d34844\" data-item-toggle=\"true\">\n<div class=\"wp-block-qubely-accordion-item qubely-block-715d0f\"><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\">Affichage d\u2019une page d\u2019erreur personnalis\u00e9e<\/span><span class=\"qubely-accordion-icon fa fa-plus\"><\/span><\/span><\/div><div class=\"qubely-accordion-body\" style=\"display:block\"><div itemprop=\"text\">\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\">Affichage d\u2019une page d\u2019erreur personnalis\u00e9e<\/h4>\n\n\n\n<p>On fonctionne en statique, c\u2019est-\u00e0-dire que l\u2019on acc\u00e8de directement aux pages html dans les liens. On essai d\u2019acc\u00e9der \u00e0 une page inconnue&nbsp;:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" loading=\"lazy\" width=\"506\" height=\"169\" src=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-02.jpg\" alt=\"\" class=\"wp-image-1730\" srcset=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-02.jpg 506w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-02-300x100.jpg 300w\" sizes=\"(max-width: 506px) 100vw, 506px\" \/><\/figure>\n\n\n\n<p class=\"has-vivid-cyan-blue-color has-text-color has-medium-font-size\"><strong>Exercice : <\/strong><\/p>\n\n\n\n<p>On d\u00e9sire afficher une page d&rsquo;erreur personnalis\u00e9e lorsque l&rsquo;on tente d&rsquo;acc\u00e9der \u00e0 une page inexistante.<\/p>\n\n\n\n<p class=\"has-vivid-cyan-blue-color has-text-color has-medium-font-size\"><strong>Solution propos\u00e9e :<\/strong><\/p>\n\n\n\n<p>On va cr\u00e9er une page html nomm\u00e9e \u00ab\u00a0404.html\u00a0\u00bb dans laquelle on va \u00e9crire \u00ab\u00a0ERREUR 404\u00a0\u00bb. Bien sur, cette page ultra basique est \u00e0 am\u00e9lior\u00e9e.<\/p>\n\n\n\n<pre title=\"Code source du fichier &quot;404.html&quot;\" class=\"wp-block-code\"><code lang=\"markup\" class=\"language-markup\">&lt;!doctype html&gt;\n&lt;html&gt;\n&lt;head&gt;\n&lt;meta charset=&quot;utf-8&quot;&gt;\n&lt;title&gt;Formation Htaccess&lt;\/title&gt;\n&lt;\/head&gt;\n\n&lt;body&gt;\n&lt;h1 align=&quot;center&quot;&gt;ERREUR 404&lt;\/h1&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;<\/code><\/pre>\n\n\n\n<p>On cr\u00e9\u00e9 \u00e0 la racine du site un fichier texte nomm\u00e9 \u00ab\u00a0.htaccess\u00a0\u00bb. On \u00e9dite ce fichier et on demande au serveur Apache de router les erreur de type 404 vers un fichier particulier (ici, \u00ab\u00a0404.html\u00a0\u00bb).<\/p>\n\n\n\n<p class=\"has-vivid-cyan-blue-color has-text-color has-medium-font-size\"><strong>On ajoute donc la ligne&nbsp;suivante :<\/strong><\/p>\n\n\n\n<pre title=\"Contenu du fichier .htaccess\" class=\"wp-block-code\"><code lang=\"apacheconf\" class=\"language-apacheconf\">ErrorDocument 404 \/htaccess\/404.html<\/code><\/pre>\n\n\n\n<p class=\"has-vivid-cyan-blue-color has-text-color has-medium-font-size\"><strong>R\u00e9sultat : <\/strong><\/p>\n\n\n\n<p>D\u00e9sormais, lorsque l&rsquo;on veut afficher une page inconnue, on affiche l&rsquo;\u00e9cran suivant.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" loading=\"lazy\" width=\"645\" height=\"139\" src=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-03.jpg\" alt=\"\" class=\"wp-image-1731\" srcset=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-03.jpg 645w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-03-300x65.jpg 300w\" sizes=\"(max-width: 645px) 100vw, 645px\" \/><\/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<div class=\"qubely-block-accordion  qubely-block-d34844\" data-item-toggle=\"true\">\n<div class=\"wp-block-qubely-accordion-item qubely-block-d2cd0f\"><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\">Redirection de fichier<\/span><span class=\"qubely-accordion-icon fa fa-plus\"><\/span><\/span><\/div><div class=\"qubely-accordion-body\" style=\"display:block\"><div itemprop=\"text\">\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\">Redirection de fichier<\/h4>\n\n\n\n<p class=\"has-vivid-cyan-blue-color has-text-color has-medium-font-size\"><strong>On a l\u2019architecture de site suivant&nbsp;:<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img decoding=\"async\" loading=\"lazy\" src=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-04-1024x547.jpg\" alt=\"\" class=\"wp-image-1732\" width=\"768\" height=\"410\" srcset=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-04-1024x547.jpg 1024w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-04-300x160.jpg 300w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-04-768x410.jpg 768w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-04.jpg 1475w\" sizes=\"(max-width: 768px) 100vw, 768px\" \/><figcaption class=\"wp-element-caption\">Architecture du site test<\/figcaption><\/figure>\n\n\n\n<p class=\"has-vivid-cyan-blue-color has-text-color has-medium-font-size\"><strong>Ce que l\u2019on veut faire&nbsp;:<\/strong> <\/p>\n\n\n\n<p>Si on tente d\u2019acc\u00e9der \u00e0 la page \/htaccess\/site\/page-1.html on redirige la demande vers le fichier \/htaccess\/site\/sous-dossier\/new.html<\/p>\n\n\n\n<p class=\"has-vivid-cyan-blue-color has-text-color has-medium-font-size\"><strong>Dans&nbsp; le fichier htaccess on ajoute la ligne&nbsp;:<\/strong><\/p>\n\n\n\n<pre title=\"Code source du fichier &quot;404.html&quot;\" class=\"wp-block-code\"><code lang=\"apacheconf\" class=\"language-apacheconf\">RedirectPermanent  \/htaccess\/site\/page-1.html http:\/\/localhost\/htaccess\/site\/sous-dossier\/new.html<\/code><\/pre>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" loading=\"lazy\" width=\"698\" height=\"177\" src=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-05.jpg\" alt=\"\" class=\"wp-image-1733\" srcset=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-05.jpg 698w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-05-300x76.jpg 300w\" sizes=\"(max-width: 698px) 100vw, 698px\" \/><\/figure>\n\n\n\n<p class=\"has-vivid-cyan-blue-color has-text-color has-medium-font-size\"><strong>Informations compl\u00e9mentaires :<\/strong><\/p>\n\n\n\n<pre title=\"Contenu du fichier .htaccess\" class=\"wp-block-code\"><code lang=\"apacheconf\" class=\"language-apacheconf\"># redirection d&#039;un site complet\n#   Attention \u00e0 ne pas oublier le slash qui localise la racine du site, et celui qui termine la ligne de commande.\nRedirectPermanent \/ https:\/\/www.webodesign.net\/\n\n# redirection d&#039;un r\u00e9pertoire\nRedirectPermanent \/htaccess\/site http:\/\/localhost\/htaccess\/site2<\/code><\/pre>\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<div class=\"qubely-block-accordion  qubely-block-d34844\" data-item-toggle=\"true\">\n<div class=\"wp-block-qubely-accordion-item qubely-block-d7bad8\"><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\">Remplacement des commandes<\/span><span class=\"qubely-accordion-icon fa fa-plus\"><\/span><\/span><\/div><div class=\"qubely-accordion-body\" style=\"display:block\"><div itemprop=\"text\">\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\">Remplacement des commandes<\/h4>\n\n\n\n<p>Dans le r\u00e9pertoire <kbd><span style=\"color: #757B7C;\" data=\"#757B7C\" class=\"qubely-text-has-color\">\/htaccess\/site<\/span><\/kbd> on avait cr\u00e9\u00e9 un fichier .htaccess contenant une personnalisation de page d\u2019erreur&nbsp;: ERREUR 404<\/p>\n\n\n\n<p>Dans le r\u00e9pertoire <kbd><span style=\"color: #757b7c;\" data=\"#757b7c\" class=\"qubely-text-has-color\">\/htaccess\/site2<\/span><\/kbd> on cr\u00e9\u00e9 un fichier .htaccess contenant une personnalisation de page d\u2019erreur&nbsp;: ERREUR 404 N.2<\/p>\n\n\n\n<ul>\n<li><kbd><span style=\"color: #757b7c;\" data=\"#757b7c\" class=\"qubely-text-has-color\">\/htaccess\/toto.html<\/span><\/kbd> affichera la page d\u2019erreur \u00ab&nbsp;ERREUR 404&nbsp;\u00bb<\/li>\n<\/ul>\n\n\n\n<ul>\n<li><kbd><span style=\"color: #757b7c;\" data=\"#757b7c\" class=\"qubely-text-has-color\">\/htaccess\/site\/toto.html<\/span><\/kbd> affichera la page d\u2019erreur \u00ab&nbsp;ERREUR 404&nbsp;\u00bb<\/li>\n<\/ul>\n\n\n\n<ul>\n<li><kbd><span style=\"color: #757b7c;\" data=\"#757b7c\" class=\"qubely-text-has-color\">\/htaccess\/site2\/toto.html<\/span><\/kbd> affichera la page d\u2019erreur \u00ab&nbsp;ERREUR 404&nbsp;N.2\u00bb<\/li>\n<\/ul>\n\n\n\n<p><em>Remarque : se r\u00e9f\u00e9rer \u00e0 la figure pr\u00e9sentant l&rsquo;architecture du site.<\/em><\/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<div class=\"qubely-block-accordion  qubely-block-d34844\" data-item-toggle=\"true\">\n<div class=\"wp-block-qubely-accordion-item qubely-block-9b737b\"><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\">Protection htaccess par authentification<\/span><span class=\"qubely-accordion-icon fa fa-plus\"><\/span><\/span><\/div><div class=\"qubely-accordion-body\" style=\"display:block\"><div itemprop=\"text\">\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\">Protection htaccess par authentification<\/h4>\n\n\n\n<p>On rajoute le dossier \u00ab&nbsp;admin&nbsp;\u00bb dans lequel on veut installer une protection d\u2019acc\u00e8s par login \/ mot de passe (se r\u00e9f\u00e9rer \u00e0 la figure pr\u00e9sentant l&rsquo;architecture du site).<\/p>\n\n\n\n<p class=\"has-vivid-cyan-blue-color has-text-color has-medium-font-size\"><strong>1- On cr\u00e9\u00e9 le fichier index.html<\/strong><\/p>\n\n\n\n<p>Celui-ci ne sera accessible que lorsque l\u2019utilisateur se sera identifi\u00e9 avec un mot de passe correct.<\/p>\n\n\n\n<pre title=\"Code source du fichier &quot;index.html&quot;\" class=\"wp-block-code\"><code lang=\"markup\" class=\"language-markup\">&lt;!doctype html&gt;\n&lt;html&gt;\n  &lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;Formation Htaccess&lt;\/title&gt;\n &lt;\/head&gt;\n &lt;body&gt;\n   &lt;h1 align=&quot;center&quot;&gt;ADMIN&lt;\/h1&gt;\n   &lt;p&gt;&lt;b&gt;Vous avez \u00e9t\u00e9 correctement identifi\u00e9&lt;\/b&gt;&lt;\/p&gt;\n &lt;\/body&gt;\n&lt;\/html&gt;<\/code><\/pre>\n\n\n\n<p class=\"has-vivid-cyan-blue-color has-text-color has-medium-font-size\"><strong>2. Ecriture du fichier .htaccess<\/strong><\/p>\n\n\n\n<p>Dans le r\u00e9pertoire admin, on cr\u00e9\u00e9 un fichier .htaccess&nbsp;avec sont contenu<\/p>\n\n\n\n<pre title=\"Contenu du fichier .htaccess\" class=\"wp-block-code\"><code lang=\"apacheconf\" class=\"language-apacheconf\"># Texte affich\u00e9 dans la fen\u00eatre d&#039;authentification login\/password\nAuthName &quot;Zone admin&quot;\n\n# D\u00e9finition du type d&#039;authentification propos\u00e9\nAuthType Basic\n\n# Chemin menant au fichier .htpasswd\nAuthUserFile C:\\laragon\\www\\htaccess\\admin\\.htpasswd\n\n# N&#039;acceptera que des utilisateurs d\u00e9clar\u00e9s et autoris\u00e9s\nRequire valid-user<\/code><\/pre>\n\n\n\n<p class=\"has-vivid-cyan-blue-color has-text-color has-medium-font-size\"><strong>3. D\u00e9termination du chemin absolu et chiffrement du mot de passe<\/strong><\/p>\n\n\n\n<p>On va cr\u00e9er un fichier \u00ab&nbsp;toto.php&nbsp;\u00bb temporairement qui aura deux&nbsp; fonctions&nbsp;:<\/p>\n\n\n\n<ul>\n<li>Demander l\u2019affichage du chemin r\u00e9el menant l\u2019acc\u00e8s au r\u00e9pertoire \u00ab&nbsp;admin&nbsp;\u00bb. Ce chemin sera a copi\u00e9 dans le fichier .htaccess \u00e0 c\u00f4t\u00e9 de AuthUserFile (remplace chemin_absolu_vers_le_fichier_.htpasswd).<\/li>\n\n\n\n<li>Cr\u00e9\u00e9 et afficher une cl\u00e9 chiffr\u00e9e du mot de passe (i\u00e7i \u00ab\u00a0essai\u00a0\u00bb).<\/li>\n\n\n\n<li><a href=\"https:\/\/bcrypt-generator.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">https:\/\/bcrypt-generator.com\/<\/a><\/li>\n<\/ul>\n\n\n\n<pre title=\"Contenu du fichier &quot;toto.php&quot;\" class=\"wp-block-code\"><code lang=\"php\" class=\"language-php\">&lt;?php\n\techo realpath(&#039;toto.php&#039;);\n\techo(&quot;&lt;br&gt;&quot;);\n\t\/\/ Methode \u00e0 utiliser sur Linux (ne fonctionne pas sous Windows)\n\techo crypt(&#039;essai&#039;);\n\techo(&quot;&lt;br&gt;&quot;);\n\t\/\/ M\u00e9thode \u00e0 utiliser sur Windows\n\techo password_hash(&#039;essai&#039;, PASSWORD_BCRYPT);\n?&gt;<\/code><\/pre>\n\n\n\n<p>L&rsquo;url http:\/\/localhost\/admin\/toto.php renvoie la page suivante :<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" loading=\"lazy\" width=\"577\" height=\"190\" src=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-12.jpg\" alt=\"\" class=\"wp-image-1734\" srcset=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-12.jpg 577w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-12-300x99.jpg 300w\" sizes=\"(max-width: 577px) 100vw, 577px\" \/><\/figure>\n\n\n\n<ul>\n<li>On copie le chemin et on le colle dans le fichier .htaccess \u00e0 la droite de AuthUserFile. <\/li>\n\n\n\n<li>On remplace toto.php par .htpasswd<\/li>\n<\/ul>\n\n\n\n<p>On copie la cl\u00e9 chiffr\u00e9e correspondant au mot de passe \u00ab\u00a0essai\u00a0\u00bb.<\/p>\n\n\n\n<p class=\"has-vivid-cyan-blue-color has-text-color has-medium-font-size\"><strong>4. Mise en place du fichier .htpasswd<\/strong><\/p>\n\n\n\n<p>On modifie le fichier .htpasswd dans lequel on va renseigner les paires&nbsp;:<\/p>\n\n\n\n<p class=\"has-text-color\" style=\"color:#757b7c\"><kbd>Nom_utilisateur:Cl\u00e9_de_chiffrement_du_mot_de_passe<\/kbd><\/p>\n\n\n\n<p style=\"text-decoration:underline\">Exemple&nbsp;: on attribue \u00e0 l&rsquo;utilisateur \u00ab\u00a0toto\u00a0\u00bb la cl\u00e9 chiffr\u00e9e du mot de passe \u00ab\u00a0essai\u00a0\u00bb<\/p>\n\n\n\n<p>toto:$2y$10$0Pa6vhErAMb5Ih6BK9f9du11ThRxA.DcYu.Yx3GLAcgCvIM1VJTJG<\/p>\n\n\n\n<p class=\"has-vivid-cyan-blue-color has-text-color has-medium-font-size\"><strong>5. R\u00e9sultat<\/strong><\/p>\n\n\n\n<p>Si l&rsquo;on acc\u00e8de \u00e0 l&rsquo;url \u00ab\u00a0http:\/\/localhost\/admin\u00a0\u00bb, on se voit invit\u00e9 de saisir un nom utilisateur ainsi que son mot de passe pour ouvrir l&rsquo;autorisation d&rsquo;acc\u00e8s \u00e0 la page \u00ab\u00a0index.html\u00a0\u00bb (Remarque : la page affiche ADMIN).<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" loading=\"lazy\" width=\"523\" height=\"273\" src=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-13.jpg\" alt=\"\" class=\"wp-image-1735\" srcset=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-13.jpg 523w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-13-300x157.jpg 300w\" sizes=\"(max-width: 523px) 100vw, 523px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" loading=\"lazy\" width=\"574\" height=\"178\" src=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-14.jpg\" alt=\"\" class=\"wp-image-1736\" srcset=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-14.jpg 574w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-14-300x93.jpg 300w\" sizes=\"(max-width: 574px) 100vw, 574px\" \/><\/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<div class=\"qubely-block-accordion  qubely-block-d34844\" data-item-toggle=\"true\">\n<div class=\"wp-block-qubely-accordion-item qubely-block-ad76f7\"><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\">R\u00e9\u00e9criture d\u2019url (url rewriting)<\/span><span class=\"qubely-accordion-icon fa fa-plus\"><\/span><\/span><\/div><div class=\"qubely-accordion-body\" style=\"display:block\"><div itemprop=\"text\">\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\">R\u00e9\u00e9criture d&rsquo;url (url rewriting)<\/h4>\n\n\n\n<p>On cr\u00e9\u00e9 un dossier \u00ab\u00a0ecriture\u00a0\u00bb dans l\u2019arborescence :<\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img decoding=\"async\" loading=\"lazy\" src=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-04-1024x547.jpg\" alt=\"\" class=\"wp-image-1732\" width=\"768\" height=\"410\" srcset=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-04-1024x547.jpg 1024w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-04-300x160.jpg 300w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-04-768x410.jpg 768w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-04.jpg 1475w\" sizes=\"(max-width: 768px) 100vw, 768px\" \/><figcaption class=\"wp-element-caption\">Architecture du site test<\/figcaption><\/figure>\n\n\n\n<p>Dans un premier temps on cr\u00e9\u00e9 un fichier \u00ab index.php \u00bb qui a pour fonction d\u2019afficher dans le navigateur \u00ab Article N.x \u00bb avec x \u00e9gal au num\u00e9ro d\u2019id pass\u00e9 en param\u00e8tre dans l\u2019url : <\/p>\n\n\n\n<p>http:\/\/localhost\/htaccess\/ecriture\/index.php?id=2<\/p>\n\n\n\n<p>Le fichier index.php \u00e0 le contenu suivant&nbsp;:<\/p>\n\n\n\n<pre title=\"Code source du fichier &quot;index.php&quot;\" class=\"wp-block-code\"><code lang=\"markup\" class=\"language-markup\">&lt;!doctype html&gt;\n &lt;html&gt;\n   &lt;head&gt;\n     &lt;meta charset=&quot;utf-8&quot;&gt;\n     &lt;title&gt;Formation Htaccess&lt;\/title&gt;\n   &lt;\/head&gt;\n   &lt;body&gt;\n     &lt;h1 align=&quot;center&quot;&gt;Article N.&lt;?php echo $_GET[&#039;id&#039;]; ?&gt;&lt;\/h1&gt;\n   &lt;\/body&gt;\n&lt;\/html&gt;\n<\/code><\/pre>\n\n\n\n<p>On voudrait pouvoir entrer une url type <a href=\"http:\/\/localhost\/htaccess\/ecriture\/article-2.html%20qui%20afficherait%20Article%20N.2\">http:\/\/localhost\/htaccess\/ecriture\/article-2.html qui afficherait Article N.2<\/a> (2 est un exemple mais l\u2019exercice doit fonctionner avec n\u2019importe quel autre chiffre). <\/p>\n\n\n\n<p>On peut justement utiliser le fichier \u00ab&nbsp;index.php&nbsp;\u00bb list\u00e9 ci-dessus&nbsp;; il faudrait lui passer la valeur 2 en param\u00e8tre&nbsp;; on peut le faire en ajoutant \u00ab&nbsp;?id=2&nbsp;\u00bb \u00e0 la fin de l\u2019url.<\/p>\n\n\n\n<p class=\"has-pale-cyan-blue-color has-text-color\">Le but est de cr\u00e9er un fichier htaccess qui a pour but de r\u00e9\u00e9crire la partie d\u2019url \u00ab&nbsp;article-2.html&nbsp;\u00bb et \u00ab&nbsp;index.php?id=2&nbsp;\u00bb<\/p>\n\n\n\n<pre title=\"Contenu du fichier .htaccess\" class=\"wp-block-code\"><code lang=\"apacheconf\" class=\"language-apacheconf\"># On demarre le moteur de r\u00e9\u00e9criture\nRewriteEngine On\n\n# R\u00e8gle de r\u00e9\u00e9criture\nRewriteRule article-([0-9]+).html index.php?id=$1 [L]<\/code><\/pre>\n\n\n\n<p class=\"has-text-color\" style=\"color:#757b7c\"><kbd>[0-9]&nbsp;: indique en expression r\u00e9guli\u00e8re&nbsp;: capture \u00e0 cet endroit apr\u00e8s article-)un chiffre entre 1 et 9<\/kbd><\/p>\n\n\n\n<p class=\"has-text-color has-source-serif-pro-font-family\" style=\"color:#757b7c\"><kbd>[0-9]+&nbsp;: la capture va pouvoir capturer d\u2019autres chiffres (101, 22, \u2026)<\/kbd><\/p>\n\n\n\n<p class=\"has-text-color has-source-serif-pro-font-family\" style=\"color:#757b7c\"><kbd>([0-9]+)&nbsp;: ce qui a \u00e9t\u00e9 captur\u00e9 mise entre parenth\u00e8ses va \u00eatre stock\u00e9 dans un variable $1 (premi\u00e8re variable cr\u00e9\u00e9e. Si on rajoute d\u2019autres parenth\u00e8ses on aurait $2, $3, \u2026)<\/kbd><\/p>\n\n\n\n<p class=\"has-text-color has-source-serif-pro-font-family\" style=\"color:#757b7c\"><kbd>[L]&nbsp;: est un flag (drapeau) qui indique la derni\u00e8re r\u00e8gle de r\u00e9\u00e9criture.<\/kbd><\/p>\n\n\n\n<p class=\"has-vivid-cyan-blue-color has-text-color\" style=\"color:#757b7c\"><em>R\u00e9sultat final : L&rsquo;url http:\/\/localhost\/ecriture\/article-3 renvoie la page suivante :<\/em><\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" loading=\"lazy\" width=\"690\" height=\"132\" src=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-16.jpg\" alt=\"\" class=\"wp-image-1739\" srcset=\"https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-16.jpg 690w, https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-16-300x57.jpg 300w\" sizes=\"(max-width: 690px) 100vw, 690px\" \/><\/figure>\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>Un fichier HTACCESS est un fichier de configuration Apache qui fournit un m\u00e9canisme pour autoriser les modifications de configuration pour diff\u00e9rents dossiers\/r\u00e9pertoires d\u2019un site Web. Il comprend des directives de configuration applicables au r\u00e9pertoire et aux sous-r\u00e9pertoires.<\/p>\n<p>Un fichier HTACCESS effectue un certain nombre de v\u00e9rifications telles que la d\u00e9finition de la page d\u2019index d\u2019un site Web, la liste de la page d\u2019erreur 404 (Page non trouv\u00e9e), l\u2019ex\u00e9cution des redirections de page 301 ou 302, le blocage de l\u2019acc\u00e8s \u00e0 partir d\u2019une adresse IP sp\u00e9cifique ou d\u2019autres sites Web.<\/p>\n","protected":false},"author":3,"featured_media":1726,"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\/2022\/12\/htaccess-00.jpg",940,490,false],"landscape":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00.jpg",940,490,false],"portraits":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00-540x320.jpg",540,320,true],"thumbnail":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00-150x150.jpg",150,150,true],"medium":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00-300x156.jpg",300,156,true],"medium_large":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00-768x400.jpg",768,400,true],"large":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00.jpg",940,490,false],"1536x1536":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00.jpg",940,490,false],"2048x2048":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00.jpg",940,490,false],"qubely_landscape":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00.jpg",940,490,false],"qubely_portrait":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00-540x320.jpg",540,320,true],"qubely_thumbnail":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-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":"Un fichier HTACCESS est un fichier de configuration Apache qui fournit un m\u00e9canisme pour autoriser les modifications de configuration pour diff\u00e9rents dossiers\/r\u00e9pertoires d\u2019un site Web. Il comprend des directives de configuration applicables au r\u00e9pertoire et aux sous-r\u00e9pertoires. Un fichier HTACCESS effectue un certain nombre de v\u00e9rifications telles que la d\u00e9finition de la page d\u2019index d\u2019un\u2026","uagb_featured_image_src":{"full":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00.jpg",940,490,false],"thumbnail":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00-150x150.jpg",150,150,true],"medium":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00-300x156.jpg",300,156,true],"medium_large":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00-768x400.jpg",768,400,true],"large":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00.jpg",940,490,false],"1536x1536":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00.jpg",940,490,false],"2048x2048":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00.jpg",940,490,false],"qubely_landscape":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00.jpg",940,490,false],"qubely_portrait":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-00-540x320.jpg",540,320,true],"qubely_thumbnail":["https:\/\/www.webodesign.net\/wp-content\/uploads\/2022\/12\/htaccess-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":"Un fichier HTACCESS est un fichier de configuration Apache qui fournit un m\u00e9canisme pour autoriser les modifications de configuration pour diff\u00e9rents dossiers\/r\u00e9pertoires d\u2019un site Web. Il comprend des directives de configuration applicables au r\u00e9pertoire et aux sous-r\u00e9pertoires. Un fichier HTACCESS effectue un certain nombre de v\u00e9rifications telles que la d\u00e9finition de la page d\u2019index d\u2019un\u2026","_links":{"self":[{"href":"https:\/\/www.webodesign.net\/index.php?rest_route=\/wp\/v2\/posts\/1725"}],"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=1725"}],"version-history":[{"count":27,"href":"https:\/\/www.webodesign.net\/index.php?rest_route=\/wp\/v2\/posts\/1725\/revisions"}],"predecessor-version":[{"id":2644,"href":"https:\/\/www.webodesign.net\/index.php?rest_route=\/wp\/v2\/posts\/1725\/revisions\/2644"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.webodesign.net\/index.php?rest_route=\/wp\/v2\/media\/1726"}],"wp:attachment":[{"href":"https:\/\/www.webodesign.net\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1725"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.webodesign.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1725"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.webodesign.net\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1725"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}