ตรวจพบการเปลี่ยนเส้นทางในคำขอ ajax?


94

ฉันต้องการใช้ jQuery เพื่อรับ URL และตรวจสอบอย่างชัดเจนว่าตอบสนองด้วยการเปลี่ยนเส้นทาง 302 หรือไม่แต่ไม่ทำตามการเปลี่ยนเส้นทาง

jQuery $.ajaxดูเหมือนจะติดตามการเปลี่ยนเส้นทางเสมอ ฉันจะป้องกันสิ่งนี้และเห็นการเปลี่ยนเส้นทางโดยไม่ทำตามได้อย่างไร

มีคำถามมากมายที่มีชื่อเรื่องเช่น "jquery ajax redirect" แต่ดูเหมือนว่าทั้งหมดจะเกี่ยวข้องกับการบรรลุเป้าหมายอื่น ๆ มากกว่าการตรวจสอบสถานะที่เซิร์ฟเวอร์ให้โดยตรง


ในกรณีเฉพาะของฉันฉันคาดหวังว่าการตอบสนอง JSON จะประสบความสำเร็จและการตอบสนอง HTML หากมีการเปลี่ยนเส้นทางไปยังหน้าเข้าสู่ระบบ ฉันได้ตรวจสอบว่าxhr.getResponseHeader("content-type")ขึ้นต้นด้วยtext/htmlและมีคำหลักเช่น "เข้าสู่ระบบ" หรือไม่และแสดงข้อความ "เซสชันของคุณหมดเวลาแล้ว" หากจำเป็น แน่นอนว่านี่ไม่ใช่คำตอบ แต่เป็นวิธีแก้ปัญหา
Salman A

คำตอบ:



42

ยินดีต้อนรับสู่อนาคต!

ตอนนี้เรามีคุณสมบัติ "responseURL" จากวัตถุ xhr เย้!

ดูวิธีรับ URL การตอบสนองใน XMLHttpRequest?

อย่างไรก็ตาม jQuery (อย่างน้อย 1.7.1) ไม่ได้ให้การเข้าถึงวัตถุ XMLHttpRequest โดยตรง คุณสามารถใช้สิ่งนี้:

var xhr;
var _orgAjax = jQuery.ajaxSettings.xhr;
jQuery.ajaxSettings.xhr = function () {
  xhr = _orgAjax();
  return xhr;
};

jQuery.ajax('http://test.com', {
  success: function(responseText) {
    console.log('responseURL:', xhr.responseURL, 'responseText:', responseText);
  }
});

ไม่ใช่วิธีแก้ปัญหาที่สะอาดและฉันคิดว่าทีม jQuery จะทำอะไรบางอย่างสำหรับ responseURL ในรุ่นต่อ ๆ ไป

เคล็ดลับ : เพียงเปรียบเทียบ URL เดิมกับ responseUrl หากเท่ากันจะไม่มีการเปลี่ยนเส้นทาง หาก "ไม่ได้กำหนด" แสดงว่าอาจไม่รองรับ responseUrl อย่างไรก็ตามตามที่ Nick Garvey กล่าวคำขอ AJAX ไม่เคยมีโอกาสที่จะไม่ทำตามการเปลี่ยนเส้นทาง แต่คุณสามารถแก้ไขงานได้หลายอย่างโดยใช้คุณสมบัติresponseUrl


1
หากต้องการเพิ่มทรัพยากรเพิ่มเติมในแอตทริบิวต์นี้ - หน้า MDN บน XHR.responseURL - ดูเหมือนว่าการสนับสนุนทั่วไปจะรออยู่บน MSIE ซึ่งเพิ่มใน Edge / 14 เท่านั้น
Eli Collins

ขอบคุณ! มีประโยชน์มาก
Gautier

ฉันพบว่ารหัสนี้ทำให้ $ .ajax ({url: 'someurl', xhrFields: {withCredentials: true}}) เกิดข้อผิดพลาดใน Internet Explorer เนื่องจากฟังก์ชัน _orgAjax ขึ้นอยู่กับตัวแปร 'this' ที่แก้ไขเป็น $ .ajaxSettings วัตถุ. เมื่อไม่เป็นเช่นนั้น jQuery จะสร้างอ็อบเจ็กต์ ActiveX IXMLHTTPRequest แทนอ็อบเจ็กต์ XMLHttpRequest ซึ่งไม่สนับสนุนคุณสมบัติ withCredentials ฉันแก้ไขสิ่งนี้โดยโทร xhr = _orgAjax.call ($. ajaxSettings); แทน xhr = _orgAjax (); ฉันหวังว่านี่จะช่วยใครบางคนได้
StephenKC

11

ในขณะที่คนอื่น ๆ ที่ตอบคำถามนี้ (เศร้า) ถูกต้องว่าข้อมูลนี้ถูกซ่อนจากเราโดยเบราว์เซอร์ฉันคิดว่าฉันจะโพสต์วิธีแก้ปัญหาที่ฉันคิดขึ้นมา:

ฉันกำหนดค่าแอปเซิร์ฟเวอร์ของฉันเพื่อตั้งค่าส่วนหัวการตอบกลับที่กำหนดเอง ( X-Response-Url) ที่มี url ที่ร้องขอ เมื่อใดก็ตามที่อาแจ็กซ์รหัสของฉันได้รับการตอบสนองก็จะตรวจสอบว่าxhr.getResponseHeader("x-response-url")มีการกำหนดในกรณีที่มันเปรียบเทียบกับ URL ที่ $.ajax()แต่เดิมมีการร้องขอผ่านทาง หากสตริงแตกต่างกันฉันรู้ว่ามีการเปลี่ยนเส้นทางและนอกจากนี้ URL ที่เรามาถึงจริงๆ

สิ่งนี้มีข้อเสียเปรียบในการต้องการความช่วยเหลือทางฝั่งเซิร์ฟเวอร์และอาจพังลงหาก url ถูก mung (เนื่องจากปัญหาการอ้างสิทธิ์ / การเข้ารหัส ฯลฯ ) ในระหว่างการเดินทางไปกลับ ... แต่สำหรับ 99% ของกรณีนี้ดูเหมือนจะได้รับ งานเสร็จ


ในฝั่งเซิร์ฟเวอร์กรณีเฉพาะของฉันคือแอปพลิเคชัน python ที่ใช้เว็บเฟรมเวิร์ก Pyramid และฉันใช้ตัวอย่างต่อไปนี้:

import pyramid.events

@pyramid.events.subscriber(pyramid.events.NewResponse)
def set_response_header(event):
    request = event.request
    if request.is_xhr:
        event.response.headers['X-Response-URL'] = request.url

เป็นความจริงที่ไม่มีทางรู้ว่ามีการเปลี่ยนเส้นทางโดยไม่ได้รับหรือไม่ แต่บางทีการเปรียบเทียบ URL ส่วนหัวที่คาดไว้กับ URL ที่เปลี่ยนเส้นทางอาจเป็นวิธีแก้ปัญหาสำหรับฉันในขณะนี้ ขอบคุณสำหรับแนวคิด
Sergio A.

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