Maison  >  Article  >  interface Web  >  Pourquoi mon en-tête \"Access-Control-Allow-Origin\" n'est-il pas autorisé dans \"Access-Control-Allow-Headers\" lors de l'envoi de fichiers avec une requête POST dans Angular ?

Pourquoi mon en-tête \"Access-Control-Allow-Origin\" n'est-il pas autorisé dans \"Access-Control-Allow-Headers\" lors de l'envoi de fichiers avec une requête POST dans Angular ?

Susan Sarandon
Susan Sarandonoriginal
2024-10-28 07:36:29634parcourir

Why is my

Problème : erreurs de requête d'origine croisée avec les en-têtes

Lors de la tentative d'envoi de fichiers avec une requête POST, les développeurs peuvent rencontrer une erreur indiquant que un en-tête de requête spécifique n'est pas autorisé par l'en-tête de réponse Access-Control-Allow-Headers.

Pour résoudre ce problème, le développeur a ajouté les en-têtes suivants à la requête :

"Access-Control-Allow-Origin" : "*",
"Access-Control-Allow-Methods" : "GET,POST,PUT,DELETE,OPTIONS",
"Access-Control-Allow-Headers": "Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With"

Cependant , cela a entraîné une nouvelle erreur indiquant que l'en-tête "Access-Control-Allow-Origin" n'est pas autorisé par l'en-tête "Access-Control-Allow-Headers".

Solution : Restrictions d'en-tête et Type de contenu par défaut

Pour les requêtes d'origine croisée, les navigateurs enverront une requête OPTIONS de contrôle en amont si le type de contenu n'est pas défini sur l'un des trois types spécifiques : "application/x-www-form-urlencoded" , "multipart/form-data" ou "text/plain".

Par défaut, Angular définit le type de contenu sur "application/json", ce qui n'est pas l'un des types acceptables pour les requêtes d'origine croisée. . Cela déclenche la demande de contrôle en amont OPTIONS, qui est ensuite rejetée en raison des restrictions sur l'en-tête "Access-Control-Allow-Headers".

Pour résoudre ce problème, le développeur peut écraser le type de contenu par défaut dans Angular ou autoriser l'en-tête "Access-Control-Allow-Headers" côté serveur.

Un exemple angulaire qui écrase l'en-tête par défaut :

$http.post(url, data, {
    headers : {
        'Content-Type' : 'application/x-www-form-urlencoded; charset=UTF-8'
    }
});

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn