jsonp dengan jquery [ditutup]


Jawaban:


144

Berikut adalah contoh yang berfungsi:

<html><head><title>Twitter 2.0</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
</head><body>
<div id='tweet-list'></div>
<script type="text/javascript">
$(document).ready(function() {
    var url =  "http://api.twitter.com/1/statuses/user_timeline/codinghorror.json";
    $.getJSON(url + "?callback=?", null, function(tweets) {
        for(i in tweets) {
            tweet = tweets[i];
            $("#tweet-list").append(tweet.text + "<hr />");
        }
    });
});
</script>
</body></html>

Perhatikan ?callback=?di akhir URL yang diminta. Itu menunjukkan getJSONfungsi yang ingin kita gunakan JSONP. Hapus itu dan permintaan JSON vanilla akan digunakan. Yang akan gagal karena kebijakan asal yang sama .

Anda dapat menemukan lebih banyak informasi dan contoh di situs JQuery: http://api.jquery.com/jQuery.getJSON/


2
Saya mencoba $ .ajax dengan parameter jsonp tersebut dan tidak dapat membuatnya berfungsi. Bagaimanapun, ini bekerja dengan baik, terima kasih.
akula1001

2
Apakah ?callback=?benar - benar dikirim sebagai bagian dari URL atau itu hanya semacam bendera yang dilihat jQuery dan dihapus sebelum mengambil URL?
hippietrail

1
Apa yang diperlukan jika URL Anda membutuhkan parameter? (ex: ?p=1&s=50)
ONDEV

2
Saya menemukan ini sebagai referensi yang baik sebagai titik awal. Untuk menjawab di atas: Ya, callback dikirim sebagai parameter dan harus dikirim kembali sebagai fungsi yang melingkupi respons JSON. Lihat stackoverflow.com/questions/7936610/… . Untuk mengirim parameter tambahan, parameter tersebut dikirim di parameter kedua getJSON (), di contoh di atas. ganti null dengan {p: 1, s: 50}
Ecropolis

Saya mendapatkan kode kesalahan 410 - hilang. Apakah ada layanan "kekal" yang mengembalikan JSON ke mana pun? Hanya agar seseorang dapat menguji bahwa metode sendiri berfungsi?
Konrad Viltersten
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.