วิธีใช้ดีบักเกอร์เครือข่ายของ Chrome ด้วยการเปลี่ยนเส้นทาง

โปรแกรมดีบั๊กเครือข่าย Chrome ให้มุมมองที่ยอดเยี่ยมเกี่ยวกับทรัพยากร HTTP ทั้งหมดที่โหลดสำหรับหน้าเว็บ แต่จะล้างรายการเมื่อมีการโหลดหน้า HTML ระดับบนสุดใหม่ สิ่งนี้ทำให้ยากมากในการดีบักหน้าเว็บที่โหลดซ้ำโดยอัตโนมัติด้วยเหตุผลหนึ่งข้อหรืออีกข้อหนึ่ง (การเรียกใช้สคริปต์หรือการตอบสนอง 300 ข้อ)

ฉันจะบอกให้ Chrome ไม่ล้างตัวแก้จุดบกพร่องเครือข่ายเมื่อโหลดหน้าเว็บระดับบนใหม่ได้หรือไม่ หรือฉันจะกลับไปดูทรัพยากรเครือข่ายของหน้าก่อนหน้าได้ไหม

หรือฉันสามารถบังคับให้ Chrome หยุดชั่วคราวก่อนที่จะโหลดหน้าใหม่เมื่อฉันไม่ได้ควบคุมหน้าเว็บที่ฉันกำลังพยายามแก้ไขข้อบกพร่องที่กำลังเปลี่ยนเส้นทางหรือไม่ เป็นส่วนหนึ่งของการเต้นรำ OpenID ที่กำลังเกิดขึ้นดังนั้นการรวมกันของ SSL และข้อมูลประจำตัวทำให้ยากมากที่จะดีบักด้วยเครื่องมือบรรทัดคำสั่ง

สิ่งนี้มีการเปลี่ยนแปลงตั้งแต่ v32 ขอบคุณ @Daniel Alexiuc & @Thanatos สำหรับความคิดเห็นของพวกเขา

ปัจจุบัน (≥ v32)

ที่ด้านบนของแท็บ "เครือข่าย" ของ DevTools จะมีช่องทำเครื่องหมายเพื่อเปิดใช้งานฟังก์ชั่น "รักษาบันทึก" หากมีการตรวจสอบบันทึกเครือข่ายจะถูกเก็บไว้ในการโหลดหน้า

จุดสีแดงเล็ก ๆ ทางด้านซ้ายตอนนี้มีวัตถุประสงค์เพื่อเปิดและปิดการบันทึกเครือข่ายอย่างสมบูรณ์

รุ่นเก่ากว่า

ใน Chrome รุ่นเก่า (v21 ที่นี่) มีจุดสีแดงเล็ก ๆ น้อย ๆ ที่คลิกได้ในส่วนท้ายของแท็บ "เครือข่าย"

หากคุณโฮเวอร์เหนือมันก็จะบอกคุณว่ามันจะ "เก็บรักษาบันทึกการนำทาง" เมื่อเปิดใช้งาน มันถือสัญญา

ฉันไม่รู้วิธีการบังคับให้ Chrome ไม่ล้างตัวแก้จุดบกพร่องเครือข่าย แต่สิ่งนี้อาจบรรลุสิ่งที่คุณต้องการ:

1. เปิดคอนโซล js
2. window.addEventListener("beforeunload", function() { debugger; }, false)

วิธีนี้จะหยุด Chrome ก่อนที่จะโหลดหน้าใหม่ด้วยการกดเบรกพอยต์

เพิ่งอัปเดตคำตอบ @bfncs

ฉันคิดว่า Chrome 43 เปลี่ยนพฤติกรรมเล็กน้อย คุณยังคงต้องเปิดใช้งาน Preserve เพื่อดู แต่ตอนนี้เปลี่ยนเส้นทางแสดงภายใต้แท็บอื่น ๆ เมื่อเอกสารที่โหลดปรากฏขึ้นภายใต้ Doc

สิ่งนี้ทำให้ฉันสับสนอยู่เสมอเพราะฉันมีคำขอเครือข่ายจำนวนมากและกรองตามประเภท XHR, Doc, JS เป็นต้น แต่ในกรณีที่เปลี่ยนเส้นทางแท็บ Doc ว่างเปล่าดังนั้นฉันต้องเดา

อีกวิธีที่ดีในการแก้ปัญหาการโทรผ่านเครือข่ายก่อนที่จะเปลี่ยนเส้นทางไปยังหน้าอื่นคือการเลือกbeforeunloadจุดพักเหตุการณ์

ด้วยวิธีนี้คุณจะมั่นใจได้ว่าจะทำให้การไหลลื่นไหลก่อนที่มันจะเปลี่ยนเส้นทางไปยังหน้าอื่นด้วยวิธีนี้การโทรเครือข่ายข้อมูลเครือข่ายและบันทึกคอนโซลยังคงอยู่ที่นั่น

โซลูชันนี้ดีที่สุดเมื่อคุณต้องการตรวจสอบการตอบสนองของการโทร

PS: คุณยังสามารถใช้จุดพัก XHR หากคุณต้องการหยุดก่อนการโทรที่เฉพาะเจาะจงหรือการโทรใด ๆ (ดูตัวอย่างภาพ)