web-dev-qa-db-fra.com

analyseur après requête jQuery.ajax avec type de contenu jsonp

J'utilise jQuery version 1.5.1 pour effectuer l'appel ajax suivant:

$.ajax({
    dataType: 'jsonp',
    data: { api_key : apiKey },
    url: "http://de.dawanda.com/api/v1/" + resource + ".json",
    success: function(data) { console.log(data); },
    error: function(jqXHR, textStatus, errorThrown) { console.log(errorThrown); console.log(textStatus); }
});

Le serveur répond avec un objet json valide:

{
  "response": {
    "type":"category",
    "entries":1,
    "params":{
      "format":"json",
      "api_key":"c9f11509529b219766a3d301d9c988ae9f6f67fb",
      "id":"406",
      "callback":"jQuery15109935275333671539_1300495251986",
      "_":"1300495252693"
    },
    "pages":1,
    "result":{
      "category":{
        "product_count":0,
        "id":406,
        "restful_path":"/categories/406",
        "parent_id":null,
        "name":"Oberteile"
       }
     }
   }
 }

Mais le rappel de succès n'est jamais appelé, mais le rappel d'erreur produit cette sortie:

jQuery15109935275333671539_1300495251986 was not called
parsererror

Pourquoi cela arrive-t-il?

Je n'utilise aucune bibliothèque supplémentaire à jQuery.

MODIFIER:  

Si j'essaie de faire l'appel ajax avec "json" comme type de données au lieu de "jsonp", le serveur répond avec une chaîne vide.

jqueryjsonpjquery-1.5parse-error
55
Thomas

JSONP nécessite que la réponse soit encapsulée dans une sorte de fonction de rappel, car elle fonctionne en injectant une balise de script dans le document en tant que mécanisme permettant de charger des données d'un autre domaine.

Essentiellement, une balise de script est insérée dynamiquement dans le document, comme suit:

<script src="http://the.other.server.com/foo?callback=someFn"></script>

callback dépend de la ressource que vous appelez. Cependant, il est courant que le paramètre soit callback.

someFn est ensuite utilisé pour traiter les données renvoyées par le serveur. Le serveur doit donc répondre avec:

someFn({theData: 'here'});

SomeFn est transmis dans le cadre de la demande. Le serveur doit donc le lire et envelopper les données de manière appropriée.

Tout cela en supposant que vous récupériez le contenu d'un autre domaine. Si c'est le cas, vous êtes limité par la même politique d'origine: http://en.wikipedia.org/wiki/Same_Origin_policy

56
Evan Trimboli

Après avoir mis à niveau vers Jquery 1.5 et tenté de passer un appel entre domaines, le même problème s’est posé. Finalement, j'ai trouvé que $ .getJSON fonctionnait. Plus précisément,

$.getJSON(url,
    function(data){
        yourFunction(data);
       return false;
    });

L'URL que j'ai utilisé était comme ceci:

var url = WEB_SERVER_URL;
url = url + "&a=" + lat;
url = url + "&b=" + lng; ....
url = url + "&jsoncallback=?";

Dans le serveur, qui est en cours d'exécution sur un autre serveur et j'ai le contrôle de ce code a été ajouté:

PrintWriter writer = response.getWriter();
String jsonString = json.toString(JSON_SPACING);
String callback = request.getParameter("jsoncallback");
// if callback in URL and is not just the "?" (e.g. from localhost)
if (callback != null && callback.length() > 1)
{
    writer.write(callback + "(" + jsonString + ");");
}
else
{
    writer.write(jsonString);
}

(L'objet json est une instance de JSONObject, le code peut être trouvé ici http://www.json.org/Java/ )

9
Bryan

lorsque vous utilisez jsonp comme type de données (demande interdomaine), Jquery génère une fonction aléatoire et que append est ajouté à l'URL demandée sous la forme d'une chaîne de requête nommée callback (callback =?), vous devez ajouter les données de réponse JSON comme paramètre de cette fonction -

url : http://www.dotnetbull.com/cross-domain-call.ashx?ref=jquery-jsonp-request
url call by ajax :
http://www.dotnetbull.com/cross-domain-call.ashx?ref=jquery-jsonp-request&callback=jQuery1510993527567155793_137593181353

Les données de réponse devraient ressembler à ceci:

 string callback = context.Request.QueryString["callback"];

 if (!string.IsNullOrEmpty(callback))
   context.Response.Write(string.Format("{0}({1});", callback, jc.Serialize(outputData)));
else
   context.Response.Write(jc.Serialize(outputData));

En savoir plus sur:Analyse syntaxique après la requête jquery.ajax avec le type de contenu jsonp

enter image description here

6
Rohit

il y a une petite erreur :) Vous devez demander .js et non .json.

$.ajax({
    dataType: 'jsonp',
    data: { api_key : apiKey },
    url: "http://de.dawanda.com/api/v1/" + resource + ".js",
    success: function(data) { console.log(data); },
    error: function(jqXHR, textStatus, errorThrown) { console.log(errorThrown); console.log(textStatus); }
});

Ah et avez-vous remarqué qu'il y a un client pour l'API? https://github.com/dawanda/dawanda-api-client-js

3
sdepold

Assurez-vous que le service que vous appelez a la possibilité de renvoyer des données au format JsonP. 

Si vous utilisez asp.net webapi, vous pouvez utiliser WebApiContrib.Formatting.Jsonp, son code source ouvert. 

Assurez-vous que vous avez une ligne comme ci-dessous dans WebApiConfig.Register.

config.Formatters.Insert (0, nouveau JsonpMediaTypeFormatter (nouveau JsonMediaTypeFormatter (), "rappel"));

Je me tirais les cheveux par dessus. J'espère que ça aide quelqu'un.

1
William

Vous ne devriez vraiment pas spécifier jsonp ici. Utilisez simplement json car vous venez de recevoir une chaîne JSON. json (json avec padding) attend une fonction javascript à exécuter. Dans ce cas, vous devez spécifier un "callback =" dans votre chaîne de requête. Je suppose que c’est la raison pour laquelle jQuery ne peut pas gérer cela aussi, il existe une propriété avec le nom callback.

1
jAndy

Essayez de lire la réponse dans un objet en utilisant $ .parseJSON:

success: function(data) {
    var json = $.parseJSON(data);
}
1
Adam

Tous les serveurs ne supportent pas jsonp. Le serveur doit définir la fonction de rappel dans ses résultats. J'utilise ceci pour obtenir des réponses JSON de sites qui renvoient du JSON pur mais ne supportent pas jsonp (mais cela pourrait être le cas à l'avenir):

function AjaxFeed(){

    return $.ajax({
        url:            'http://somesite.com/somejsonfile.php',
        data:           {something: true},
        dataType:       'jsonp',

        /* Very important */
        contentType:    'application/json',
    });
}

function GetData()
    AjaxFeed()

    /* Everything worked okay. Hooray */
    .done(function(data){
        return data;
    })

    /* Okay jQuery is stupid manually fix things */
    .fail(function(jqXHR) {

        /* Build HTML and update */
        var data = jQuery.parseJSON(jqXHR.responseText);

        return data;
    });
}
0
mAsT3RpEE

Le même problème que je devenais jusqu'à ce que je n'ai pas ajouté le paramètre "callback =?" ou "c =?" dans l'URL.

Comme: " http://de.dawanda.com/api/v1/ " + resource + ".json & c =?" 

Peut résoudre votre problème. Cela a fonctionné pour moi.

0
Parveen Verma