Récuperer un flux Json online avec Ajax

Version imprimable

Bonjour,

En effet, je souhaite récuperer un cours de la bourse en format json. L'url présent dans l'ajax renvoie : "{"to": "EUR", "rate": 0.76934913100000002, "from": "USD"}".

le soucis est que cette partie" $('#teste').text(reponse.to) " ne rentre pas en action.
Donc plusieur hypothese :
- ce bout de code ne fonctionne pas
- la fonction $.ajax n'arrive pas au success donc l'url est faux
- j'utilise mal la fonction $.ajax
- ou autre ...

Je ne comprends pas
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 $(document).ready(function() { $('#test').click( function(){ $("#test").text('Clique prie en compte'); $.ajax({ url: 'http://rate-exchange.appspot.com/currency?from=USD&to=EUR', type: 'GET', dataType: 'json', success : function(reponse){ $('#teste').text(reponse.to); } }); return false; }); });
Code:

1 2 3 4 5 6 7 8 9 10 11 12 <html> <head> <script type="text/javascript" src="https://www.google.com/jsapi"></script> <script src="jquery-2.js"></script> </head> <body> <div id="test"> <span>Cliquez-moi pour afficher le graph</span> <span id="teste"></span> </div> </body> </html>
Merci pour tout!

04/07/2013, 10h33
Bovino

Citation:

Merci pour tout!

De rien ! :ccool:

Au fait, tu as peut-être une question à poser ? :whistle:
04/07/2013, 11h43
starfiko

C'est pour savoir si vous suivez lol :p

J'ai modifié le 1er poste, la problematique si dessous, ce trouve aussi au-dessus

Bref le soucis est que cette partie" $('#teste').text(reponse.to) " ne rentre pas en action.
Donc plusieur hypothese :
- ce bout de code ne fonctionne pas
- la fonction $.ajax n'arrive pas au success donc l'url est faux
- j'utilise mal la fonction $.ajax
- ou autre ...

Je ne comprends pas
04/07/2013, 11h50
Bovino

Avec $.ajax() tu vas être confronté à la Same Origin Policy.
Utilise $.getJSON() pour contourner cela.

En fait, j'ai déjà essayé et dès que j'utilise le $.getJSON, le reste de la page plante.
Il y a un graphique qui est sensé s'afficher plus bas et le code " $("#test").text('Clique prie en compte')" ne fonctionne plus.
Donc j'avais abandonné cette solution.
Code:

1 2 3 4 5 6 7 8 9 10 $(document).ready(function() { $('#test').click( function(){ $("#test").text('Clique prie en compte'); $.getJSON('http://rate-exchange.appspot.com/currency?from=USD&to=EUR',function(reponse){ $:('#teste').text(reponse.to); } return false; }); });

04/07/2013, 13h43
Bovino

Code:

$:('#teste').text(reponse.to);

Tu ne vois rien d'anormal ? :aie:

ah Oui erreur de copier/coller. Pourquoi toute la page bug, tout simplement problème de parenthèse et intervalle. Donc maintenant ça fait exactement comme la fonction $.ajax. Le code $('#teste').text(reponse.to); ne fonctionne pas. Pour faire plus simple je mets alert(reponse.to); mais cela ne fonctionne toujours pas.
Code:

1 2 3 4 5 6 7 8 9 10 $(document).ready(function() { $('#test').click( function(){ $("#test").text('Cliquer prie en compte'); $.getJSON('http://rate-exchange.appspot.com/currency?from=USD&to=EUR',function(reponse){ alert(reponse.to); }); }); return false; });

Après quelques recherches sur Same Origin Policy, il faut utiliser du JSONP au lieux de JSON. Comme l'url ne comporte pas le même domaine, on a des problème de sécurité. JSONP permet d'encapsuler le JSON, ainsi de contourner le "Same Origin Policy".

Pour plus de détaille (en anglais): http://www.codeproject.com/Articles/...-Origin-Policy
avec des exemples simples : http://fcargoet.evolix.net/2009/02/jsonp-avec-jquery/

Au final voici, mon code fonctionnel :
Code:

1 2 3 4 5 6 7 8 9 10 11 $(document).ready(function() { $('#test').click( function(){ $("#test").text('Cliquer prie en compte'); $.ajax({ url : 'http://rate-exchange.appspot.com/currency?from=USD&to=EUR', dataType : 'jsonp', success : function(data){alert(data.to);} //votre callback }); }); return false; });
En tout cas, Merci!