Frage

JavaScript

Zum Beispiel habe ich den folgenden JavaScript -Code (DOJO 1.6 ist bereits geladen):

dojo.require("dojo.io.script")

// PART I
var jsonpArgs = {
    url: "http://myapp.appspot.com/query",
    content: {
        id: "1234",
        name: "Juan",
        start_date: "2000-01-01",
        callback: "recover"
    }
};

// PART II
dojo.io.script.get(jsonpArgs).then(function(data) {
    console.log(data);
});

// PART III
function recover(data) {
    console.log(data);
}

Direkte Abfrage vom Browser

Ich verstehe, dass mein Server die Abfrage empfängt, als hätte ich Folgendes in die Adressleiste eingeben:

http://myapp.appspot.com/query?id=1234&name=Juan&start_date=2000-01-01&callback=recover

Erwartete Reaktion

Wenn ich meinen Server direkt mit der Browser -Adressleiste befragt habe, empfange ich im MIME -Typ application/json und Klartext im Browser gerendert, so ähnlich:

recover(
    {
        id: 1234,
        name: Juan,
        data: [
            ["2000-01-01", 1234],
            ["2000-01-02", 5678]
        ]
    }
);

Problem

Wenn ich nun auf Teil II des JavaScript zurückblicke, würde ich die JSONP -Anfrage mit ausführen dojo.io.script.get(jsonpArgs). Dies gibt eine zurück Deferred Objekt, das ich durch Verkettung nutzen kann .then Danach. Beachten Sie, dass ich den Handler für die definiert habe .then Ereignis, der ausgegeben wird, der erfasst wurde data zur Konsole.

Alles, was ich in die Konsole bekomme, ist jedoch eine Event. Ich habe versucht, seinen Datenbaum zu durchsuchen, aber ich konnte die von mir erwarteten Daten nicht finden.

Frage

  1. Wo ist die Antwort für eine JSONP -Anfrage gespeichert? Wie finde ich es?
  2. Mein Server (den ich steuere) gibt nur eine Klartext -Rendering der angeforderten Daten aus, die in die eingewickelt sind callback Funktion (hier angegeben als recover) und spezifiziert a application/json Mime Typ. Gibt es noch etwas, was ich auf meinem Server einrichten muss, damit die Antwortdaten von der erfasst werden Deferred Objekt?

Versuchte Lösung

Ich kann die Antwort tatsächlich wiederherstellen, indem ich die Rückruffunktion definiere (in diesem Fall recover in Teil III des JavaScript). In den DOJO -Tutorials haben sie jedoch die Daten mit dem wiederhergestellt Deferred (und .then) Rahmen. Wie mache ich es mit Dojo? Deferreds?

Update (Verwenden des Twitter -Beispiels aus dem DOJO -Tutorial)

Nehmen Sie zum Beispiel dieses Skript aus dem DOJO -Tutorial. Jiggy mit JSONP bekommen. Ich habe es bearbeitet, um Daten an der Konsole zu protokollieren.

dojo.require("dojo.io.script");
dojo.io.script.get({
    url: "http://search.twitter.com/search.json",
    callbackParamName: "callback",
    content: {q: "#dojo"}
}).then(function(data){
    //we're only interested in data.results, so strip it off and return it
    console.log(data); // I get an Object, not an Event, but no Twitter data when browsing the results property
    console.log(data.results) // I get an array of Objects
    return data.results;
});

Zum console.log(data), Ich bekomme eine Object, nicht ein Event wie in meinem Fall dargestellt. Da das Beispiel impliziert, dass sich die Daten befinden data.results, Ich versuche auch, diesen Baum zu durchsuchen, aber ich sehe meine erwarteten Daten von Twitter nicht. Ich bin ratlos.

Zum console.log(data.results), Ich bekomme eine Reihe von Objects. Wenn ich Twitter direkt abfrage, würde ich das in Klartext bekommen. Jeder Object Enthält die übliche Tweet-Meta-Daten wie Benutzername, Zeit, Benutzerporträt und den Tweet selbst. Leicht genug.

Dieser trifft mich direkt auf den Kopf. Der Handler für die .then Kette, eine anonyme Funktion, erhält nur ein Argument data. Aber warum ist es, dass die results Eigentum in console.log(data) und das zurückgegebene Objekt, von dem ich bekomme console.log(data.results) sind anders?

War es hilfreich?

Lösung

Ich habe es verstanden.

Manuelle Rückrufimplementierung

function recover(data) {
    console.log(data);
}

var jsonpArgs = {
    url: "http://myapp.appspot.com/query",
    content: {
        id: "1234",
        name: "Juan",
        start_date: "2000-01-01",
        callback: "recover"
};

dojo.io.script.get(jsonpArgs);

Dies ist die Anfrage, die mein Server empfängt:

http://myapp.appspot.com/query?id=1234&name=Juan&start_date=2000-01-01&callback=recover

In diesem Fall erwarte ich die folgende Ausgabe von meinem Server:

recover({
    id: 1234,
    name: Juan,
    data: [
        ["2000-01-01", 1234],
        ["2000-01-02", 5678]
    ]
});

Drei Dinge zu beachten:

  1. Server wird erwarten callback in der Abfrage -URL -Zeichenfolge. callback wird als Eigenschaft von implementiert jsonpArgs.
  2. Weil ich angegeben habe callback=recover, mein Server wird angeschlossen recover( + the_data_I_need + ), Gibt die gesamte Zeichenfolge in den Browser zurück und Browser wird ausgeführt recover(the_data_I_need). Das heisst...
  3. Dass ich zum Beispiel definieren muss, function recover(one_argument_only) {doAnythingYouWantWith(one_argument_only)}

Das Problem bei diesem Ansatz ist, dass ich nicht nutzen kann Deferred Ketten mithilfe .then. Zum Beispiel:

dojo.io.script.get(jsonpArgs).then(function(response_from_server) {
    console.log(response_from_server);
})

Das wird mir eine geben Event, ohne Spur der erwarteten Reaktion.


Nutzen Sie die Implementierung von DOJO von JSONP -Anfragen

var jsonpArgs = {
    url: "http://myapp.appspot.com/query",
    callbackParamName: "callback",
    content: {
        id: "1234",
        name: "Juan",
        start_date: "2000-01-01"
};

dojo.io.script.get(jsonpArgs);

Dies ist die Anfrage, die mein Server empfängt:

http://myapp.appspot.com/query?id=1234&name=Juan&start_date=2000-01-01&callback=some_function_name_generated_by_dojo

In diesem Fall erwarte ich die folgende Ausgabe von meinem Server:

some_function_name_generated_by_dojo({
    id: 1234,
    name: Juan,
    data: [
        ["2000-01-01", 1234],
        ["2000-01-02", 5678]
    ]
});

Dinge zu beachten:

  1. Beachten Sie die Eigenschaft von jsonpArgs, callbackParamName. Der Wert dieser Eigenschaft muss der Name der Variablen (in der von dem Server erwarteten Abfrage -URL -Zeichenfolge) sein. Wenn mein Server erwartet callbackfoo, dann callbackParamName: "callbackfoo". In meinem Fall erwartet mein Server den Namen callback, deshalb callbackParamName: "callback".

  2. Im vorherigen Beispiel habe ich in der Abfrage -URL angegeben callback=recover und ging weiter implementieren function recover(...) {...}. Diesmal muss ich mir keine Sorgen machen. Dojo fügt eine eigene bevorzugte Funktion ein callback=some_function_name_generated_by_dojo.

  3. ich stelle mir vor some_function_name_generated_by_dojo definiert als:

Definition:

function some_function_name_generated_by_dojo(response_from_server) {
    return response_from_server;
}

Natürlich ist die Definition nicht so einfach, aber der Vorteil dieses Ansatzes besteht darin, dass ich das aufgeschobene Rahmen von DOJO nutzen kann. Siehe den folgenden Code, der mit dem vorherigen Beispiel identisch ist:

dojo.io.script.get(jsonpArgs).then(function(response_from_server) {
    console.log(response_from_server);
})

Dies gibt mir die genauen Daten, die ich brauche:

{
    id: 1234,
    name: Juan,
    data: [
        ["2000-01-01", 1234],
        ["2000-01-02", 5678]
    ]
}
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top