Pourquoi est-ce que je reçois une erreur « La réponse pour le contrôle en amont a un code d'état HTTP 404 non valide » lorsque j'effectue une requête POST AngularJS ?

Échec du POST d'AngularJS : comprendre les requêtes CORS et de contrôle en amont

Introduction

Effectuer des interactions HTTP, en particulier des requêtes POST, entre AngularJS les applications et les serveurs back-end peuvent parfois rencontrer des problèmes. Un message d'erreur courant rencontré est "La réponse pour le contrôle en amont a un code d'état HTTP 404 non valide". Cet article vise à faire la lumière sur cette erreur et à fournir une solution.

CORS et demandes de contrôle en amont

Le partage de ressources cross-origine (CORS) est un mécanisme utilisé par les navigateurs. pour gérer les requêtes réseau entre différentes origines. Lorsqu'un navigateur envoie une requête depuis une origine (par exemple, http://localhost:8080) vers une autre origine (par exemple, http://example.com), il envoie d'abord une requête de contrôle en amont avec la méthode OPTIONS pour déterminer si le serveur autorise la demande réelle.

Comprendre l'erreur

L'erreur « La réponse au contrôle en amont a un code d'état HTTP 404 non valide » indique que la demande OPTIONS de contrôle en amont envoyée par le navigateur est renvoyant un code d'état HTTP de 404 (introuvable). Cela signifie que le serveur ne répond pas correctement à la demande de contrôle en amont.

Solution

La solution à cette erreur réside dans la gestion correcte des demandes de contrôle en amont CORS côté serveur . Dans l'exemple SlimPHP fourni dans la question, le problème est que la demande de contrôle en amont n'est pas traitée et renvoie un code d'état 404.

Pour résoudre ce problème, il faut ajouter le code suivant au serveur SlimPHP :

<code class="php">$app->options('/{routes:.+}', function ($request, $response, $args) {
    return $response;
});</code>

Ce code définit un gestionnaire de requêtes de contrôle en amont CORS fourre-tout pour toutes les routes de l'application. Il définit les en-têtes CORS nécessaires et renvoie une réponse vide.

Conseils supplémentaires

De plus, les conseils suivants peuvent aider à prévenir les problèmes liés à CORS :

• Assurez-vous que l'en-tête Access-Control-Allow-Origin est défini sur « * » pour autoriser les requêtes de n'importe quelle origine.
• Envisagez de désactiver les vérifications CORS côté client si elles ne sont pas nécessaires pour votre application.
• Définissez l'en-tête Access-Control-Max-Age pour spécifier la durée pendant laquelle les navigateurs doivent mettre en cache les en-têtes de réponse de contrôle en amont CORS.

En suivant ces étapes, vous pouvez résoudre les problèmes liés à CORS. problèmes et effectuer des requêtes POST réussies à partir des applications AngularJS.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!