https://wiki.abdoulaye-diallo.com/index.php?action=history&feed=atom&title=Routing_Vues.js_et_React.js_Serveur_Apache 2026-07-07T16:59:21Z Historique des versions pour cette page sur le wiki MediaWiki 1.40.1 https://wiki.abdoulaye-diallo.com/index.php?title=Routing_Vues.js_et_React.js_Serveur_Apache&diff=56&oldid=prev 2024-06-10T08:20:11Z

<p>Page créée avec « Par défaut, Apache ne sait pas comment gérer les routes de votre application VueJS ou ReactJS et renvoie une erreur 404 lorsque vous essayez d&#039;accéder directement à une route autre que la page d&#039;accueil. Pour résoudre ce problème, vous devez configurer votre serveur Apache pour qu&#039;il redirige toutes les requêtes vers le fichier &lt;code&gt;index.html&lt;/code&gt; de votre application VueJS. Voici comment vous pouvez procéder : # &#039;&#039;&#039;Créer un fichier .htaccess&#039;&#039;&#039; : C... »</p> <p><b>Nouvelle page</b></p><div>Par défaut, Apache ne sait pas comment gérer les routes de votre application VueJS ou ReactJS et renvoie une erreur 404 lorsque vous essayez d'accéder directement à une route autre que la page d'accueil. Pour résoudre ce problème, vous devez configurer votre serveur Apache pour qu'il redirige toutes les requêtes vers le fichier &lt;code&gt;index.html&lt;/code&gt; de votre application VueJS. Voici comment vous pouvez procéder :<br /> <br /> # '''Créer un fichier .htaccess''' : Ce fichier permet de configurer Apache pour rediriger toutes les requêtes vers &lt;code&gt;index.html&lt;/code&gt;, sauf celles visant des fichiers ou des répertoires existants.&lt;syntaxhighlight lang=&quot;bash&quot;&gt;<br /> &lt;IfModule mod_rewrite.c&gt;<br /> RewriteEngine On<br /> RewriteBase /<br /> RewriteRule ^index\.html$ - [L]<br /> RewriteCond %{REQUEST_FILENAME} !-f<br /> RewriteCond %{REQUEST_FILENAME} !-d<br /> RewriteRule . /index.html [L]<br /> &lt;/IfModule&gt;<br /> <br /> &lt;/syntaxhighlight&gt;<br /> # '''Placer le fichier .htaccess à la racine de votre projet VueJS''' : À côté de votre &lt;code&gt;index.html&lt;/code&gt;.<br /> # '''Ajouter les directives nécessaires dans le fichier .htaccess''' : (pas nécessaire sur Plesk)<br /> <br /> Ces directives font les choses suivantes :<br /> <br /> * &lt;code&gt;RewriteEngine On&lt;/code&gt; : Active le moteur de réécriture.<br /> * &lt;code&gt;RewriteBase /&lt;/code&gt; : Définit la base de l'URL utilisée pour la réécriture.<br /> * &lt;code&gt;RewriteRule ^index\.html$ - [L]&lt;/code&gt; : Si l'URL demandée est &lt;code&gt;index.html&lt;/code&gt;, ne rien faire (le laisser tel quel).<br /> * &lt;code&gt;RewriteCond %{REQUEST_FILENAME} !-f&lt;/code&gt; : Si le fichier demandé n'existe pas...<br /> * &lt;code&gt;RewriteCond %{REQUEST_FILENAME} !-d&lt;/code&gt; : ... et si le répertoire demandé n'existe pas...<br /> * &lt;code&gt;RewriteRule . /index.html [L]&lt;/code&gt; : ... alors rediriger la demande vers &lt;code&gt;index.html&lt;/code&gt;.<br /> <br /> # '''Activer le module mod_rewrite d’Apache''' (si ce n'est pas déjà fait) : Pour cela, vous devrez vous assurer que le module &lt;code&gt;mod_rewrite&lt;/code&gt; est activé. Vous pouvez le faire via l'interface de gestion de Plesk ou en accédant à la configuration Apache si vous avez les privilèges nécessaires. Voici une commande que vous pouvez utiliser si vous avez accès au terminal :<br /> <br /> Une fois ces étapes terminées, Apache redirigera toutes les requêtes vers &lt;code&gt;index.html&lt;/code&gt;, permettant à votre application VueJS de gérer les routes côté client comme prévu.</div>

Abdoulaye