jQuery: Melakukan permintaan AJAX yang sinkron

187

Saya telah melakukan beberapa jQuery di masa lalu, tetapi saya benar-benar terjebak dalam hal ini. Saya tahu tentang pro dan kontra menggunakan panggilan ajax sinkron, tetapi di sini akan diperlukan.

Halaman jarak jauh dimuat (dikontrol dengan pembakar), tetapi tidak ada pengembalian ditampilkan.

Apa yang harus saya lakukan agar fungsi saya kembali dengan benar?

function getRemote() {

    var remote;

    $.ajax({
        type: "GET",
        url: remote_url,
        async: false,
        success : function(data) {
            remote = data;
        }
    });

    return remote;

}
Industri
sumber
Kode Anda terlihat baik-baik saja. apa yang kembali? Apakah ada kesalahan js?
ShankarSangoli
11
Saya merasa agak ironis - Anda bertanya bagaimana melakukan operasi "Asynchronous JavaScript & XML" secara serempak. Yang benar-benar perlu Anda lakukan adalah "SJAX".
VitalyB
3
Catatan: spec sudah mulai mencabut permintaan AJAX yang sinkron.
Léo Lam
2
tampaknya pernyataan "[sinkron] akan diperlukan" menunjukkan kurangnya pemahaman tentang mesin JavaScript, sehingga aplikasi yang dirancang dengan buruk. Saya ingin memahami jika ada kasus di mana sinkronisasi benar-benar diperlukan.
pmont
15
@ pmont seems that the statement "[synchronous] will be required" indicates a lack of understanding of JavaScript engines, thus a poorly architected app.Atau pemahaman yang sangat baik: Jika Anda ingin melakukan panggilan AJAX onbeforeunload, menggunakan permintaan sinkron sebenarnya adalah cara yang disarankan (karena jendela browser akan hilang sebelum permintaan dikembalikan sebaliknya). Dengan cara apa pun ia dengan jelas mengatakan `Saya tahu tentang pro dan kontra menggunakan panggilan ajax sinkron` ... Mungkin hanya percaya padanya?
Stijn de Witt

Jawaban:

298

Saat Anda membuat permintaan sinkron, itu seharusnya

function getRemote() {
    return $.ajax({
        type: "GET",
        url: remote_url,
        async: false
    }).responseText;
}

Contoh - http://api.jquery.com/jQuery.ajax/#example-3

PERHATIKAN: Mengatur properti async ke false sudah tidak digunakan lagi dan sedang dalam proses dihapus ( tautan ). Banyak browser termasuk Firefox dan Chrome sudah mulai mencetak peringatan di konsol jika Anda menggunakan ini:

Chrome:

Sinkronisasi XMLHttpRequest pada utas utama sudah usang karena efeknya yang merugikan bagi pengalaman pengguna akhir. Untuk bantuan lebih lanjut, periksa https://xhr.spec.whatwg.org/ .

Firefox:

Sinkronisasi XMLHttpRequest pada utas utama sudah usang karena efeknya yang merugikan bagi pengalaman pengguna akhir. Untuk bantuan lebih lanjut http://xhr.spec.whatwg.org/

Dogbert
sumber
16
Perhatikan bahwa responseTextselalu mengembalikan string. Jika Anda mengharapkan JSON, bungkus $.ajaxdengan JSON.parse.
usandfriends
6
Catatan: xhr.spec.whatwg.org/#the-open()-metode Sinkronisasi permintaan tidak digunakan lagi ...
teynon
5
@ Tom Dan begitu juga tag <i>dan <b>. Rekomendasi saya: tetap menggunakan fitur ini agar tidak hilang.
Stijn de Witt
1
karena ini mengunci browser, masuk akal untuk menambahkan batas waktu: 5000 atau lebih ke opsi.
commonpike
1
@ usandfriends Untuk parse string ke objek lebih aman menggunakan jQuery.parseJSON daripada JSON.parse stackoverflow.com/questions/10362277/…
AntonE
33

Anda menggunakan fungsi ajax secara tidak benar. Karena sinkron, ini akan mengembalikan data inline seperti:

var remote = $.ajax({
    type: "GET",
    url: remote_url,
    async: false
}).responseText;
Jake
sumber
17

seberapa jauh url itu? apakah itu dari domain yang sama? kode terlihat oke

coba ini

$.ajaxSetup({async:false});
$.get(remote_url, function(data) { remote = data; });
// or
remote = $.get(remote_url).responseText;
Otak
sumber
Ya! Domain yang sama dan semuanya. remote_urldidefinisikan dengan benar dan panggilan AJAX dilakukan sebagaimana mestinya (dikontrol dengan pembakar). Tidak bisa kembali!
Industri
3
function getRemote() {
    return $.ajax({
        type: "GET",
        url: remote_url,
        async: false,
        success: function (result) {
            /* if result is a JSon object */
            if (result.valid)
                return true;
            else
                return false;
        }
    });
}
pengguna3116547
sumber
7
Harap sertakan beberapa penjelasan mengapa ini akan membantu OP.
krillgar
Ini praktik yang baik untuk mengembalikan objek json dari sisi server. Ini memberi Anda lebih banyak kontrol. Tapi, Anda perlu menambahkan dataType: "json" ke parameter $ .ajax Anda di atas.
jjwdesign
Apa artinya ini: "Ini memberi Anda lebih banyak kontrol"?
Grantwparks
3
Tidak terkait tetapi Anda dapat: mengembalikan hasil. Valid; // Ini sudah boolean
dpineda