web-dev-qa-db-fra.com

Pourquoi mon $ .ajax montrant "preflight is invalid redirect redirect error"

J'ai essayé le code suivant dans Postman et cela fonctionnait. Y at-il quelque chose qui ne va pas avec le code?

$.ajax({
   url: 'http://api.example.com/users/get',
   type: 'POST',
   headers: {
      'name-api-key':'ewf45r4435trge',
   },
   data: {
      'uid':36,
   },
   success: function(data) {
      console.log(data);
   }
});

J'ai eu cette erreur dans ma console comme ci-dessous, s'il vous plaît aviser.

XMLHttpRequest ne peut pas charger http://api.example.com/users/get Response pour le contrôle en amont n'est pas valide (redirection)

javascriptjqueryajax
50
Jennifer Aniston

J'ai reçu la même erreur lorsque j'ai tenté d'appeler le service Web https en tant que service Web http.

e.g when I call url 'http://api.example.com/users/get'
which should be 'https://api.example.com/users/get'

Cette erreur est due au statut de redirection 302 lorsque vous essayez d'appeler http au lieu de https.

32
Peter T.

Cette réponse va sur exactement la même chose (bien que pour angular) - c'est un problème CORS.

Une solution rapide consiste à modifier chaque demande POST en spécifiant l'une des valeurs de l'en-tête 'Content-Type' qui ne déclenchera pas de contrôle en amont. Ces types sont:

  • application/x-www-form-urlencoded
  • multipart/form-data
  • texte simple

N'importe quoi d'autre déclenche un contrôle en amont.

Par exemple:

$.ajax({
   url: 'http://api.example.com/users/get',
   type: 'POST',
   headers: {
      'name-api-key':'ewf45r4435trge',
      'Content-Type':'application/x-www-form-urlencoded'
   },
   data: {
      'uid':36,
   },
   success: function(data) {
      console.log(data);
   }
});
24
JoshuaDavid

L'erreur indique que le contrôle en amont reçoit une réponse de redirection. Cela peut arriver pour plusieurs raisons. Découvrez où vous allez être redirigé vers des indices sur la raison pour laquelle cela se produit. Vérifiez l'onglet Réseau dans les outils de développement.

Une des raisons, comme @Peter T l'a mentionné, est que l'API nécessite probablement des connexions HTTPS plutôt que HTTP et toutes les demandes via HTTP sont redirigées. L'en-tête Location renvoyé par la réponse 302 indiquerait la même URL avec http remplacée par https dans ce cas.

Une autre raison peut être que votre jeton d'authentification n'est pas envoyé ou n'est pas correct. La plupart des serveurs sont configurés pour rediriger toutes les demandes qui n'incluent pas de jeton d'authentification vers la page de connexion. Encore une fois, vérifiez votre en-tête Location pour voir si c'est là que vous allez être envoyé et vérifiez également que le navigateur a bien envoyé votre jeton d'authentification avec la demande.

Souvent, un serveur sera configuré pour toujours rediriger les demandes qui n'ont pas de jeton d'authentification vers la page de connexion, y compris vos demandes preflight/OPTIONS. C'est un problème. Modifiez la configuration du serveur pour autoriser les demandes OPTIONS des utilisateurs non authentifiés.

6
Planky

Veuillez définir le type de contenu http dans l'en-tête et vous assurer également que le serveur authentifie CORS. Voici comment faire en PHP:

//NOT A TESTED CODE
header('Content-Type: application/json;charset=UTF-8');
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: DELETE, HEAD, GET, OPTIONS, POST, PUT');
header('Access-Control-Allow-Headers: Content-Type, Content-Range, Content-Disposition, Content-Description');
header('Access-Control-Max-Age: 1728000');

Prière de se référer à:

http://www.w3.org/TR/cors/#cross-Origin-request-with-preflight-0

Comment fonctionne l'en-tête Access-Control-Allow-Origin?

5
Airwind711

Mon problème était que les demandes POST ont besoin des barres obliques "/".

5
ehacinom

J'ai eu le même problème et cela m'a gardé pendant des jours. À la fin, j'ai réalisé que mon URL pointant vers l'application était complètement fausse. Exemple:

URL: 'http://api.example.com/'
URL: 'https://api.example.com/'.

Si c'est http ou https, vérifiez.
Vérifiez l'URL de redirection et assurez-vous que c'est la même chose que vous transmettez.

4
Chambah Russell

J'ai eu la même erreur, mais le problème était que j'avais une faute de frappe dans l'URL

url: 'http://api.example.com/TYPO'

L'API avait une redirection vers un autre domaine pour toutes les URL erronées (erreurs 404).

Donc, corriger la faute de frappe à la bonne URL l'a corrigé pour moi.

2
Bolli

Mon problème a été causé par l'exact opposé de @ehacinom. Mon API générée par Laravel n’a pas aimé les requêtes '/' de fin sur POST. Fonctionne correctement sur localhost mais ne fonctionne pas lors du téléchargement sur le serveur. 

0
user558720