Maison > interface Web > js tutoriel > 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
Libérer: 2024-10-28 07:36:29
original
703 Les gens l'ont consulté

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"
Copier après la connexion

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'
    }
});
Copier après la connexion

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!

source:php.cn
Déclaration de ce site Web
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
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal