2010-06-04 12 views
1

Nous avons publié un API JSON pour partager des données entre quelques domaines. Nous fournissons un rappel qui permet à tous les GET provenant de sites distants d'être renvoyés en tant que JSON.À l'aide de jquery, comment travaillez-vous autour des POST intersites de la même manière que les données de remplissage pour les GET jquery inter-sites?

GET http://mysite.com/jsonapi/object?callback=?

Retours: ({ « someKey »: « someData »})

Maintenant tout cela fonctionne bien chaque fois que nous GET'ting données de sites distants, mais le moment que je tente de faire une jquery à distance POST à ​​l'API pour récupérer des données json, je reçois un retour nul dans Firefox. Je peux poster un formulaire depuis un site distant vers l'API json sans aucun problème et récupérer des données json. Le problème ne se pose qu'avec les POST de jquery. J'imagine que c'est une sorte de protection contre les scripts inter-sites que je ne comprends pas complètement. Lorsque je jquery POST données à une URL sur le même site que je télécharge la page POSTing jquery, je n'ai pas le problème. Comment faire une publication jquery sur un site distant et traiter les données json que je récupère? Je peux ajouter un rappel ou apporter un autre type de modification aux données json renvoyées et je ne m'inquiète pas pour la sécurité. Je veux juste être en mesure de jquery poster un formulaire plutôt que de passer les paramètres comme un GET.

Comment est-ce que je modifierais ceci à jquery POST à ​​un site distant?

<form method="post" action="http://www.remoteSite.com" name="input"> 
     Quick form to test update public data:<br> 
     New data:<input type="text" value="New Data" name="newData"><br> 
     <input type="submit" value="Submit"> 
</form> 

<script src="_js/jquery-1.4.2.min.js" type="text/javascript"> </script> 
<script type="text/javascript"> 
$("form").submit(function(e){ 
    var form = $(this); 
    $.ajax({ 
     url : form.attr('action'), 
     method: form.attr('method'), 
     data : form.serialize(), // data to be submitted 
     success: function(response){ 
      alert(response); // do what you like with the response 
     } 
    }); 
    return false; 
}); 
</script> 

Ceci renvoie actuellement [Application JavaScript] comme l'alerte plutôt que les données de retour json attendues.

Répondre

3

La règle d'origine identique est appliquée lorsque vous tentez de publier via javascript. Les raisons évidentes sont notamment la publication d'informations potentiellement sensibles sans que l'utilisateur ne le sache (via ajax). Jquery supporte JSONP, cette technique permet d'envoyer des données à un site en dehors de votre domaine, et cela en créant un élément de façon dynamique sur votre page, ce qui enveloppe la réponse dans un appel de fonction. La chose à noter ici, cependant, est que vous ne pouvez pas faire un POST avec un élément tel que demandé par GET.

$.ajax({ 
    url : form.attr('action'), 
    method: form.attr('method'), 
    data : form.serialize(), // data to be submitted 
    success: function(response){ 
     alert(response); // do what you like with the response 
    }, 
    dataType: 'jsonp' 
}); 
+0

Merci. Exactement ce que je cherchais. – Chris

0

Le JSONP interdomaine n'est pas du tout un AJAX. Il n'utilise pas XMLHttpRequest. Ce n'est rien de plus qu'un élément de script dynamique qui charge du code JavaScript.

Donc en utilisant ajax il n'y a pas moyen d'obtenir le post de domaine croisé. Mais si vous soumettez un formulaire, vous pouvez faire un iframe piratage pour faire un post iframe caché sur le site distant puis avoir le site distant intégré et iframe de votre site local en passant dans les données que vous voulez passer puis avoir cet appel le javascript rappeler. (Beaucoup de comment facebook connect travaillait). Mais à moins que vous ayez à faire un post, ne le faites pas.