Requête Ajax ne parvient pas, ne peut pas voir pourquoi

J'ai créé une API qui renvoie des données en json, et maintenant je suis en création d'une application pour tester l'API par recevoir les données et de les utiliser sur la page. Cependant, mon code ajax (voir ci-dessous) ne répond pas par une raison quelconque, et le message d'erreur indique juste "error" (Erreur: erreur).

Quel est le problème avec le code?

le code:

    $.ajaxSetup ({
      url: "http://localhost:8000/products", //<--- returns json
      type: "GET",
      headers:{
        "Accept":"application/json",
        "Content-type":"application/x-www-form-urlencoded"
      }
    })
    $.ajax({
        success: function(data){
            console.log("You made it!");
        },
        error: function(xhr) {
           console.log("Error: " + xhr.statusText);
       }
    }).done(function(data){
        console.log(data);
    })

C'est l'info que je reçois dans Chrome (Inspecteur -> Réseau):

Nom: produits localhost/, Méthode: OBTENIR, Statut: (annulé), Type: en attendant, Initiateur: jquery-dernière.js:8434 Script, Taille: 13B 0B, Temps: 95ms 0.0 jours

obtenez-vous de la réussite ou de fait.
Aucun d'eux, j'obtiens l'erreur.
et une chose de plus que l'url est de retour json données codées.
Pourriez-vous prendre un regard sur les Outils de développement Chrome onglet "Réseau" et coller le résultat de l'appel, ici? Je soupçonne que la réponse du serveur peut être le problème. Aussi, avez-vous annuler la demande, Pavel Hodek suggéré dans réponse?
Une chose est sûre. Je vais mettre à jour ma question avec cette info!

OriginalL'auteur holyredbeard | 2012-12-15

5
```
$.ajax({
    /* ajax options omitted */
    error: function (xmlHttpRequest, textStatus, errorThrown) {
         if(xmlHttpRequest.readyState == 0 || xmlHttpRequest.status == 0) 
              return;  //it's not really an error
         else
              //Do normal error handling
});
```
Soins pour expliquer votre réponse?
Erreur avec le statut ou readyState == 0 peut se produire lorsque vous annulez une requête ajax avant la fin, ou lorsque vous accédez à une autre page ou lorsque vous actualisez la page. Détail informations d'erreur que vous pouvez obtenir à partir de la première ou de la troisième paramètre - essayez de connecter leur console à l'aide de console.log(...) pour voir ce qui se passe.
Ok, semble raisonnable. Je me demande si c'est le cas de l'OP.
J'ai essayé votre code et readyState et le statut de l'ordre de 0, donc pas de "vrai" erreur alors je suppose?
Je pense que pas d'erreur alors. Essayez également inspecter réponse avec Firebug (extension de Firefox) ou avec un violon ou avec les Outils de développement dans Chrome, vous pouvez y voir les données que vous venez de Réponse. Si tout fonctionne et que les données sont OK, alors aucune erreur ne se produit.

OriginalL'auteur Pavel Hodek
9

Ce qui est probablement le problème

Je pense que je sais de votre problème ici. Apparemment vous êtes le chargement d'une page d'un protocole de+domaine+port (ex. "http://localhost/"), mais à invoquer la requête AJAX vers un autre protocole, le domaine ou le port (dans ce cas, probablement le seul port est différent: "http://localhost:8000/products").

De cette façon, vous êtes probablement frapper Même La Politique De L'Origine limitation, qui est fonction de sécurité de votre navigateur. Dans de tels cas, les navigateurs peuvent indiquer que la demande spécifique a été "annulé" (parce que le navigateur bloqué).

Solution

Il y a plusieurs solutions à votre problème:
- (plus facile) en tenir à la même protocole de+domaine+port pour les deux site d'origine et le point de terminaison demandé par AJAX,
- (le plus simple à utiliser) construire un point d'arrivée sur le serveur, afin par exemple. "http://localhost/products" will call "http://localhost:8000/products" en arrière-plan et sera de retour de sa réponse (comme un walkaround pour SOP),
- certaines solutions plus complexes comme JSONP, de la SCRO etc. (plus de détails ici: https://stackoverflow.com/a/8467697/548696),
OriginalL'auteur Tadeck
2

Essayez d'utiliser seulement
```
$.ajax({
  url: "http://localhost:8000/products", 
  dataType: 'json',
  success: function(data){
            console.log("You made it!");
        },
        error: function(xhr) {
           console.log("Error: " + xhr.statusText);
       }
});
```
Au lieu de l'utilisation faite de rappel , vous pouvez utiliser la ligne de code à l'intérieur de la réussite ou complète de rappel. Son tout à fait simple et plus propre.

Merci, je suis d'accord c'est beaucoup plus propre. Si le problème reste le même - l'erreur est levée.

OriginalL'auteur Sudhanshu Yadav
0

Pourquoi ne pas vous essayez et de fusionner les deux appels ajax dans un. et aussi essayer de changer type = "POST"
```
$.ajax({
    type: "POST",
    url: "http://localhost:8000/products",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(data){alert(data);},
    error: function(errMsg) {
        alert(errMsg);
    }
});
```
"deux appels ajax dans un"? Il y a un seul appel. Si vous parlez d'invoquer $.ajaxSetup(), alors peut-être que l'OP veut l'utiliser dans l'avenir (comme de simplifier le code en appliquant le principe SEC).
Merci pour l'info.je n'ai pas su 🙂
BTW $.ajaxSetup() ne pas faire appel ajax, c'est l'installation de l'ajax module seulement.

OriginalL'auteur Moiz
0

Je pense que votre navigateur en cache l'erreur, ou peut-être il ya des problèmes dans la définition des en-têtes correctement, alors essayez d'ajouter cette façon là-bas dans le $.ajaxsetup():
```
    $.ajaxSetup ({
      url: "http://localhost:8000/products", //<--- returns json
      type: "GET",
      dataType: 'json',
      cache: false,
      contentType: "application/json"
    });
```
essayer de cette façon, une fois et voir si fonctionne.

Encore une erreur, cependant, l'URL est quelque peu différente dans la console lors de l'ajout de cette ligne: GET localhost:8000/produits?_=1355580034481 (le point d'interrogation et tous les numéros sont ajoutés).

OriginalL'auteur Jai

Vous devez vous connecter pour publier un commentaire.

Ce qui est probablement le problème

Solution