Hủy bỏ yêu cầu JSONP của jQuery sẽ ném lỗi

Question

tôi đang tạo plugin tự động đơn giản (autocompleter) với jQuery. Thật không may tôi phải sử dụng jsonp. Nó là ok và nó hoạt động, nhưng khi tôi hủy bỏ yêu cầu nó sẽ ném lỗi.

Uncaught TypeError: Property 'jQuery171036404498340561986_1330693563756' of object [object Window] is not a function 

Có là mã

if(xhr) {xhr.abort()}; 
xhr = $.ajax({ 
    url: "someurl/getmedata", 
    type: 'get', 
    dataType: 'jsonp', 
    data: {q: "query"}, 
    success: function(results) {}, 
    error: function() {} 
}) 

cách cổ điển với json, xml hoặc yêu cầu khác hoạt động tốt.

Bạn có đề xuất gì không?

Answer 1

JSONP không không sử dụng XMLHTTPRequest nhưng thực sự tạo ra một thẻ <script> trong tài liệu để có thể thực hiện các yêu cầu cross-domain.

Bạn chỉ đơn giản là không thể hủy yêu cầu JSONP.

Nó được nêu trong tài liệu $.ajax():

Một số loại yêu cầu Ajax, chẳng hạn như JSONP và cross-domain GET yêu cầu, không sử dụng XHR; trong những trường hợp đó, các tham số XMLHttpRequest và textStatus được truyền vào hàm gọi lại là không xác định.

Đối với jQuery 1.5+, trước đây đã trả về đối tượng XHR từ $ .ajax(), bây giờ nó trả về đối tượng jqXHR thay thế đóng gói đối tượng XHR.

Khi cơ chế vận chuyển là một cái gì đó khác hơn là XMLHttpRequest (ví dụ, một thẻ script cho một yêu cầu JSONP) đối tượng jqXHR mô phỏng chức năng XHR mẹ đẻ nếu có thể.

Vì vậy, nó trả về một đối tượng nhưng một số chức năng thực sự không có sẵn, như .abort().

---

Plugin jQuery-JSONP dường như cung cấp khả năng tự hủy bỏ yêu cầu JSONP. Tôi đã không sử dụng nó bản thân mình nhưng nó có giá trị cho nó một thử.

Answer 2

jQuery sử dụng thẻ <script> để triển khai JSONP. Bạn không thể hủy tải các thẻ script.

Answer 3

Trước hết, hãy sử dụng một số logic sắp xếp thứ tự. Điều này sẽ đảm bảo yêu cầu cuối cùng của bạn chiếm ưu thế so với yêu cầu cũ. Ở đây bạn có một số example.

Ngoài ra, bạn có thể tận dụng những $.ajax cài đặt:

timeout: thiết lập một thời hạn theo yêu cầu và ngăn chặn các yêu cầu thất bại âm thầm.

beforeSend: xác thực một số điều kiện trước khi thực hiện cuộc gọi. Bổ sung trợ giúp trình tự.

As of jQuery 1.5, the beforeSend option will be called regardless of the type of request. 

Ví dụ:

function updateResults() { 

    // Init counter & record current request 
    if (!window.reqSeq) window.reqSeq = 0; 
    window.reqSeq +=1; 
    var thisRequest = window.reqSeq; 

    $.ajax({ 
    url: [..], 
    crossDomain: true, 
    contentType: "application/json", 
    dataType: 'jsonp', 
    timeout: 5000, // give 5 seconds of margin 
    data: { [..] }, 
    beforeSend: function() { 
     if(thisRequest < window.reqSeq) { 
     return false; 
     } 
    }, 
    success: function(data, textStatus, jqXHR) { 
     if(thisRequest < window.reqSeq) { 
     return; 
     } 
     else print(data); 
    }, 
    error: function(jqXHR, textStatus, errorThrown) { 
     // it'll be called on timeout (error) and beforeSend (abort) 
     print(textStatus); 
    } 
    }); 

}