jQuery: การดำเนินการร้องขอ AJAX แบบซิงโครนัส


187

ฉันเคยทำ jQuery มาแล้ว แต่ฉันติดอยู่กับเรื่องนี้อย่างสมบูรณ์ ฉันรู้เกี่ยวกับข้อดีข้อเสียของการใช้ ajax แบบซิงโครนัส แต่ที่นี่จะต้องใช้

โหลดเพจระยะไกล (ควบคุมด้วย firebug) แต่ไม่มีการแสดงผลคืน

ฉันควรทำอย่างไรที่แตกต่างกันเพื่อให้ฟังก์ชันของฉันกลับมาอย่างเหมาะสม

function getRemote() {

    var remote;

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

    return remote;

}

รหัสคุณดูดี มันคืออะไรกลับมา? มีข้อผิดพลาด js หรือไม่?
ShankarSangoli

11
ฉันคิดว่ามันค่อนข้างน่าขัน - คุณกำลังขอวิธีการดำเนินการ "Asynchronous JavaScript & XML" แบบซิงโครนัส สิ่งที่คุณต้องทำคือ "SJAX"
VitalyB

3
หมายเหตุ: ข้อมูลจำเพาะได้เริ่มลดการร้องขอ AJAX แบบซิงโครนัส
Léo Lam

2
ดูเหมือนว่าคำสั่ง "[ซิงโครนัส] จะต้องระบุ" บ่งชี้ว่าขาดความเข้าใจในเครื่องมือ JavaScript จึงเป็นแอปที่ออกแบบมาไม่ดี ฉันต้องการที่จะเข้าใจว่ามีหลายกรณีที่จำเป็นต้องทำการซิงค์จริงๆ
pmont

15
@pmont seems that the statement "[synchronous] will be required" indicates a lack of understanding of JavaScript engines, thus a poorly architected app.หรือเข้าใจดีมาก: หากคุณต้องการโทร AJAX การonbeforeunloadใช้คำขอแบบซิงโครนัสเป็นวิธีที่แนะนำจริง ๆ (เนื่องจากหน้าต่างเบราว์เซอร์จะหายไปก่อนที่คำขอจะถูกส่งกลับ) ในทางใดทางหนึ่งเขาบอกชัดเจนว่า "ฉันรู้เกี่ยวกับข้อดีข้อเสียของการใช้ ajax แบบซิงโครนัส" ... บางทีแค่เชื่อเขา?
Stijn de Witt

คำตอบ:


298

ในขณะที่คุณทำการร้องขอแบบซิงโครนัสนั่นควรจะเป็น

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

ตัวอย่าง - http://api.jquery.com/jQuery.ajax/#example-3

โปรดทราบ:การตั้งค่าคุณสมบัติ async ให้เป็นเท็จนั้นเลิกใช้แล้วและอยู่ในขั้นตอนการลบออก ( ลิงค์ ) เบราว์เซอร์จำนวนมากรวมถึง Firefox และ Chrome เริ่มพิมพ์คำเตือนในคอนโซลแล้วหากคุณใช้สิ่งนี้

โครเมียม:

XMLHttpRequest แบบซิงโครนัสบนเธรดหลักถูกคัดค้านเนื่องจากผลกระทบที่เป็นอันตรายต่อประสบการณ์ของผู้ใช้ สำหรับความช่วยเหลือเพิ่มเติมให้ตรวจสอบhttps://xhr.spec.whatwg.org/

Firefox:

XMLHttpRequest แบบซิงโครนัสบนเธรดหลักถูกคัดค้านเนื่องจากผลกระทบที่เป็นอันตรายต่อประสบการณ์ของผู้ใช้ สำหรับความช่วยเหลือเพิ่มเติมhttp://xhr.spec.whatwg.org/


16
โปรดทราบว่าresponseTextจะส่งคืนสตริงเสมอ หากคุณคาดว่า JSON ห่อด้วย$.ajax JSON.parse
usandfriends

6
หมายเหตุ: xhr.spec.whatwg.org/#the-open()-methodคำขอซิงโครนัสที่เลิกใช้แล้ว ...
teynon

5
@Tom <i>และ<b>แท็กก็เช่นกัน คำแนะนำของฉัน: ใช้คุณลักษณะเหล่านี้ต่อไปเพื่อไม่ให้หายไป
Stijn de Witt

1
เนื่องจากล็อคเบราว์เซอร์จึงควรเพิ่มการหมดเวลา: 5000 หรือมากกว่านั้นในตัวเลือก
commonpike

1
@usandfriends สำหรับการแยกวิเคราะห์สตริงเป็นวัตถุจะปลอดภัยยิ่งขึ้นในการใช้ jQuery.parseJSON แทน JSON.parse stackoverflow.com/questions/10362277/…
AntonE

33

คุณใช้ฟังก์ชัน ajax ไม่ถูกต้อง เนื่องจากมันเป็นแบบซิงโครนัสจึงจะส่งคืนข้อมูลแบบอินไลน์ดังนี้:

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

17

URL นั้นไกลแค่ไหน? มาจากโดเมนเดียวกันหรือ รหัสดูโอเค

ลองนี้

$.ajaxSetup({async:false});
$.get(remote_url, function(data) { remote = data; });
// or
remote = $.get(remote_url).responseText;

อ้อ! โดเมนเดียวกันและทุกอย่าง remote_urlมีการกำหนดอย่างเหมาะสมและการโทร AJAX ดำเนินการอย่างถูกต้องตามที่กล่าวไว้ (ควบคุมด้วย firebug) แค่ไม่กลับมา!
อุตสาหกรรม

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;
        }
    });
}

7
โปรดระบุคำอธิบายว่าทำไมสิ่งนี้ถึงช่วย OP ได้
krillgar

เป็นวิธีปฏิบัติที่ดีในการส่งคืนวัตถุ json จากฝั่งเซิร์ฟเวอร์ มันช่วยให้คุณควบคุมได้มากขึ้น แต่คุณต้องเพิ่ม dataType: "json" ในพารามิเตอร์ $ .ajax ของคุณด้านบน
jjwdesign

สิ่งนี้หมายความว่า: "มันช่วยให้คุณควบคุมได้มากกว่า"?
grantwparks

3
ไม่เกี่ยวข้อง แต่คุณสามารถ: ส่งคืน result.valid; // นี้มีอยู่แล้วแบบบูล
dpineda
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.