L'actualisation de ma page angulaire me donne une erreur de serveur 404, cela fait la même chose si je navigue manuellement vers le répertoire dans la barre de recherche. J'héberge via un serveur IIS.
Ce problème ne se produit que chaque fois que je construis mon projet angulaire avec ng build --prod et que je le télécharge ensuite sur mon serveur Web. Beaucoup de gens disent que vous devriez utiliser la méthode de hachage, mais je ne veux pas qu'un hachage soit affiché dans mon url, et c'est une méthode très ancienne. Certaines personnes disent aussi que je devrais changer ma balise , mais cela n'a pas fonctionné.
Voici mon Balise de mon index.html si cela est utile.
<head> <!-- META DATA --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- APP --> <title>SebastianElstadt</title> <base href="/"> <link rel="icon" type="image/x-icon" href="assets/images/app-icon.png"> <!-- STYLES --> <link rel="stylesheet" href="[fontawesome cdn]"> </head>
J'utilise également un composant qui s'affiche si l'URL saisie ne correspond pas l'un de mes chemins définis. Mais il ne s'affiche pas.
Donc, pour résumer, chaque fois que je rafraîchis ma page ou que je navigue manuellement dans la barre de recherche sur mon site angulaire, il affiche une page d'erreur de serveur 404. Et je ne veux pas utiliser la méthode de hachage.
4 Réponses :
Je ne sais pas quel serveur vous utilisez, mais si vous ne souhaitez pas utiliser la méthode de hachage, chaque requête doit être redirigée vers votre index.html où l'application angular est en cours d'exécution.
Si le serveur ne trouve pas la route / votre / sous / route et dit "404 non trouvé".
Vous devriez vérifier https://angular.io/guide/deployment pour le déploiement de l'Angular app. Il a besoin d'une certaine configuration basée sur votre serveur http. Par exemple, pour Apache, vous aurez besoin du fichier .htaccess suivant dans la racine de votre projet
RewriteEngine On
# If an existing asset or directory is requested go to it as it is
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]
# If the requested resource doesn't exist, use index.html
RewriteRule ^ /index.html
J'ai suivi les étapes de configuration de mon fichier web.config pour mon serveur IIS, mais maintenant, chaque fois que je navigue sur mon site Web, il affiche simplement 500 - Erreur de serveur interne
@Sebastian, il y a probablement une erreur dans votre fichier web.config. Je ne sais pas quelle est votre configuration et comment vous avez structuré votre environnement de serveur, donc c'est difficile à dire à moins que vous ne partagiez un peu plus d'informations à ce sujet.
Vous pouvez résoudre ce problème en créant un fichier web.config:
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
<defaultDocument>
<files>
<clear />
<add value="index.html" />
</files>
</defaultDocument>
<rewrite>
<rules>
<rule name="AngularJS Routes" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
</conditions>
<action type="Rewrite" url="/" logRewrittenUrl="true" />
</rule>
</rules>
</rewrite>
<security>
<requestFiltering allowDoubleEscaping="true">
<fileExtensions>
<add fileExtension=".json" allowed="true" />
</fileExtensions>
</requestFiltering>
</security>
<directoryBrowse enabled="true" />
<staticContent>
<remove fileExtension=".woff" />
<remove fileExtension=".woff2" />
<mimeMap fileExtension=".woff" mimeType="application/font-woff" />
<mimeMap fileExtension=".woff2" mimeType="application/font-woff2" />
</staticContent>
</system.webServer>
</configuration>
. Erreur Net Core avec Angular 4: 404 lorsque j'actualise le navigateur
Je veux juste m'assurer, suis-je supposé changer des choses ici et là dans ce code ou le copier directement?
Vous pouvez l'utiliser tel quel. Il est également possible de générer automatiquement ce fichier en utilisant IIS.
J'ai ajouté l'en-tête du fichier de configuration Web afin que vous puissiez l'utiliser directement.
Merci, mais chaque fois que j'ajoute le fichier web.config et ajoute ce code, il charge 500 - Erreur de serveur interne
J'essaie de déployer une application Angular 6 d'une seule page sur SharePoint et d'obtenir le même problème que l'affiche originale. J'ai ajouté le fichier web.config dans le même répertoire que mon fichier index.html. Des idées sur ce qui ne va pas?
si vous êtes dans une page comme mywebsite / example / 1 et appuyez sur Actualiser dans le navigateur, parfois il ne frappe pas le routeur et vous ne pouvez rien faire en angulaire pour le réparer, mais vous pouvez créer un dossier appelé `` exemple '' et à l'intérieur, mettez un autre index.html avec un simple script javascript qui dit window.location.href = http: //mywebsite/index.html et qui vous donne une idée de ce qui se passe et aussi un travail autour.
Il vaut la peine de rester que cette solution nécessite que le "module de réécriture" soit installé sur votre IIS. Vous pouvez google pour cela ou utiliser l'outil "installateur de plate-forme Web".
Cela résoudra votre problème, ajoutez le fichier .htaccess à la racine de votre projet
et mettez ce contenu
<IfModule mod_rewrite.c>
<IfModule mod_negotiation.c>
Options -MultiViews -Indexes
</IfModule>
RewriteEngine On
# Handle Authorization Header
RewriteCond %{HTTP:Authorization} .
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
# Redirect Trailing Slashes If Not A Folder...
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} (.+)/$
RewriteRule ^ %1 [L,R=301]
# Handle Front Controller...
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.html [L]
</IfModule>
«Vieux» ne veut pas dire «mauvais». En tant que débutant, je préfère voir un hachage dans mon URL plutôt que de devoir reconfigurer mon serveur. Mais pour vous répondre, il s'agit d'un problème de serveur HTTP, pas d'un problème angulaire. Vous devez utiliser les bonnes balises pour identifier votre serveur, sinon vous n'obtiendrez pas de réponse appropriée.
Vous devez utiliser la Stratégie de localisation de chemin