2012-07-12 18 views
12

Sto tentando di utilizzare JSON per avviare una richiesta POST a un'API.Utilizzo di JSON POST Request

ho trovato un po 'di codice di esempio, e prima di arrivare troppo lontano volevo ottenere quel lavoro, ma mi sono bloccato ...

<html> 
<head> 
<script type="text/javascript"> 
function JSONTest() 
{ 
requestNumber = JSONRequest.post(
    "https://example.com/api/", 
    { 
     apikey: "23462", 
     method: "example", 
     ip: "208.74.35.5" 
    }, 
    function (requestNumber, value, exception) { 
     if (value) { 
      processResponse(value); 
     } else { 
      processError(exception); 
     } 
    } 
); 
} 
</script> 
</head> 
<body> 

<h1>My JSON Web Page</h1> 


<button type="button" onclick="JSONTest()">JSON</button> 

</body> 
</html> 

Questo è un file HTML, che sono correre in cromo. Non succede niente quando clicco sul pulsante ...

Penso che mi manchi un pezzo di javascript che interpreta la risposta JSON e può essere visualizzato? altrimenti qualche altro consiglio?

+0

ho avuto l'impressione JSON è un sottoinsieme di Javascript ...? e quindi Javascript potrebbe eseguirlo senza problemi? – GK1667

+0

JSON è un formato di interscambio di dati. I browser moderni possono capirlo, ma i browser più vecchi hanno bisogno di una libreria per essere in grado di trasformare stringhe JSON, in oggetti JavaScript. Ti consiglio di utilizzare una libreria come jQuery per aiutarti con questo, in quanto ciò risolverà anche alcuni dei problemi di compatibilità del browser per i client più vecchi. – Phil

+0

La maggior parte dei browser moderni dispone di un oggetto JSON disponibile, ma JSONRequest non è un oggetto o una funzione disponibile in modo nativo sulla finestra o sugli oggetti del documento. – kinakuta

risposta

27

Un esempio di jQuery è riportato di seguito. Spero che questo aiuti

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<title>My jQuery JSON Web Page</title> 
<head> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script type="text/javascript"> 

JSONTest = function() { 

    var resultDiv = $("#resultDivContainer"); 

    $.ajax({ 
     url: "https://example.com/api/", 
     type: "POST", 
     data: { apiKey: "23462", method: "example", ip: "208.74.35.5" }, 
     dataType: "json", 
     success: function (result) { 
      switch (result) { 
       case true: 
        processResponse(result); 
        break; 
       default: 
        resultDiv.html(result); 
      } 
     }, 
     error: function (xhr, ajaxOptions, thrownError) { 
     alert(xhr.status); 
     alert(thrownError); 
     } 
    }); 
}; 

</script> 
</head> 
<body> 

<h1>My jQuery JSON Web Page</h1> 

<div id="resultDivContainer"></div> 

<button type="button" onclick="JSONTest()">JSON</button> 

</body> 
</html> 

processo di debug Firebug

Firebug XHR debug process

+1

Questo è un ottimo esempio! Il mio problema è che è stato inviato alla parte "richiesta di errore". Ho sostituito tutto con i dati non campione, ma non funzionerà ancora. Ho contattato questa API con successo e ottenuto un respnose indietro usando la funzione PHP curl e facendo in modo che l'utente inserisca apikey, method e ip su una pagina html che posta al php. Altre idee su come potrei ottenere questo risultato e ottenere una risposta usando javascript? – GK1667

+0

Ciao. Ho aggiornato la mia risposta sopra, ho appena cambiato il gestore degli errori, che dovrebbe darti qualche informazione in più sull'errore. Normalmente, se questo gestore di errori viene chiamato di solito, si tratta di un errore di trasporto/corsia, come ha detto Jason. Prova ad aggiornare il codice e a vedere quale è il nuovo errore. Consiglio vivamente l'installazione di Fiddler o l'uso del Debug F12 di Google Chrome, in modo che tu possa vedere "esattamente" cosa sta succedendo "sotto il cofano". Sentiti libero di tornare da me :) – Phil

+0

Grazie mille. Apprezzo molto che tu mi abbia seguito. Ho lavorato per ottenere questo insieme per diversi giorni e non riesco nemmeno a connettermi! Ad ogni modo, ho provato l'aggiunta al codice. Dà solo "0" indietro. Ho in esecuzione firebug, sono nuovo ad usarlo, quindi se avete qualche richiesta su quale pezzo vorreste che esaminassi, lo farò volentieri! – GK1667

0

I moderni browser non implementano attualmente JSONRequest (per quanto ne so) poiché al momento è solo una bozza. Ho trovato qualcuno che l'ha implementato come una libreria che puoi includere nella tua pagina: http://devpro.it/JSON/files/JSONRequest-js.html (ricorda che ha alcune dipendenze).

Altrimenti, si potrebbe voler andare con un'altra libreria JS come jQuery o Mootools.