จะป้องกันไม่ให้ Chrome รีเฟรชหน้าเมื่อดูแหล่งที่มาได้อย่างไร


20

เมื่อดูแหล่งที่มาของหน้าใน Google Chrome เบราว์เซอร์จะเปิดแท็บใหม่และโดยทั่วไปจะวาง URL ด้วยview-source:คำนำหน้า สิ่งนี้ไม่พึงประสงค์

ในฐานะนักพัฒนาฉันอาจรวมเอาท์พุทการวิเคราะห์บางอย่างที่มองเห็นได้ในแหล่งที่มาหลังจากส่งแบบฟอร์ม เมื่อ Chrome รีเฟรชหน้าเว็บเพื่อดูแหล่งที่มามันจะทำให้ข้อมูลนี้หายไป

อย่างไรก็ตามมีการป้องกันพฤติกรรมนี้หรือไม่?

หมายเหตุ:ฉันคุ้นเคยกับตัวเลือก "ตรวจสอบองค์ประกอบ" นี่ไม่ใช่การสแตนด์บายที่เพียงพอสำหรับการดูแหล่งที่มาของหน้ากระดาษดิบของหน้าที่แน่นอนที่คุณกำลังดูอยู่


สคริปต์ทดสอบอย่างรวดเร็ว

<pre>
  <?= print_r($_POST, true) ?>
</pre>
<form action="" method="post">
  <input id="foo" name="foo" value="bar" />
  <input type="submit" />
</form>

หลังจากคลิกปุ่มส่งหน้าจะแสดง

Array
(
    [foo] => bar
)

หากคุณดูแหล่งที่มาของหน้าคุณจะเห็นผลลัพธ์ว่างเปล่า $_POST

<pre>
Array
(
)
</pre>
<form action="" method="post"> 
  <input id="foo" name="foo" value="bar" /> 
  <input type="submit" /> 
</form> 

ปรับปรุง

เห็นได้ชัดว่าข้อผิดพลาดนี้ถูกส่งไปแล้ว เฮ้อ ...

หากใครรู้เรื่องการทำงานที่ดีฉันจะขอบคุณมันมาก


ผู้คนที่นั่นไม่เข้าใจว่าแหล่งข้อมูลไม่ได้ถูกเก็บไว้ในหน่วยความจำ (เนื่องจากความเรียบง่าย) แต่ได้รับการจัดการ คุณควรเห็นความคิดเห็นcode.google.com/p/chromium/issues/detail?id=523#c47เหมือนที่เป็นความคิดที่ดีเช่นกัน ...
Tamara Wijsman

คำตอบ:


12

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

ป้อนคำอธิบายรูปภาพที่นี่

ป้อนคำอธิบายรูปภาพที่นี่

ป้อนคำอธิบายรูปภาพที่นี่

ป้อนคำอธิบายรูปภาพที่นี่

ป้อนคำอธิบายรูปภาพที่นี่

ข้อมูลมากกว่านี้

ฉันรันการทดสอบบางอย่างโดยใช้ไฟล์ php แบบง่ายซึ่งแสดงวิธีการร้องขอที่ใช้และค่า POSTed บันทึกพร็อกซีเซิร์ฟเวอร์เพื่อดูว่าคำขอใดที่ Chrome กำลังทำและchrome://net-internals/view-cache/คำนำหน้าเพื่อดูว่า Chrome กำลังแคชอะไรอยู่

เมื่อคุณใช้คำสั่งดูแหล่งที่มา Chrome จะแสดงแหล่งที่มาของเวอร์ชันแคชของหน้าเว็บและจะใช้เฉพาะหน้าที่แคชที่ร้องขอผ่านวิธีการ GET เท่านั้น

หากคุณกำลังดูหน้าที่คุณเคยขอใช้ GET และ POST ก่อนหน้านี้เฉพาะรุ่น GET เท่านั้นที่ถูกแคช การใช้คำสั่ง View Source จะไม่ขอหน้าซ้ำอีก แต่จะแสดงรุ่น GET ที่แคชไว้ไม่ใช่เวอร์ชัน POST ที่มองเห็นได้ในปัจจุบันหากมี

หากคุณกำลังดูหน้าเว็บที่คุณร้องขอโดยใช้วิธีการ POST เท่านั้นการใช้คำสั่ง View Source จะทำให้ Chrome มองหาแคชไม่พบสิ่งใดร้องขอหน้าโดยใช้ GET แคชและแสดงแหล่งที่มา ของที่


การค้นพบที่ดี!
Tamara Wijsman

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

1
@Jonz หลังจากตระหนักถึงความเขลานี้แล้วฉันไม่ชอบ Google Chrome ตัวอย่างเช่นฉันต้องการตรวจสอบแหล่งที่มาของหน้าขอบคุณเพจของเว็บไซต์อีคอมเมิร์ซ (โหลดหน้าเว็บหลังจากที่ผู้ใช้ชำระเงินเต็มจำนวนเพื่อตรวจสอบการยิงรหัส GTM) ตอนนี้โหลดหน้าฉันเพียงแค่ยกเลิกเซสชั่นที่จำเป็นและอีกครั้งในการโหลดถ้าไม่พบเซสชั่นฉันเปลี่ยนเส้นทางผู้ใช้ไปยังหน้าแรก ดังนั้นหากฉันพยายามใช้ Google Chrome Hack ฉันจะไม่สามารถดูแหล่งที่มาของหน้าได้เพราะสามารถส่งคำขอ GET และ POST ใหม่ได้เท่านั้น แต่ไม่สามารถรีเซ็ตเซสชันได้ ดังนั้นฉันจะแนะนำuse "Inspect Element"
Abhishek Madhani

1
@AbhishekMadhani ฉันไม่แน่ใจว่าคุณตั้งใจจะตอบฉัน แต่ฉันจะทำซ้ำสิ่งที่ฉันเขียนในความคิดเห็นด้านล่าง - ดูเหมือนว่าใน Chrome Canary 37 คำขอเครือข่ายใหม่จะไม่ถูกส่งเมื่อคุณดูแหล่งที่มา .
Jon z

2

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

มีส่วนขยายที่เรียกว่า "ตัวแสดงแหล่งที่มาอย่างรวดเร็ว " ซึ่งดูเหมือนจะแสดงที่มาของหน้าเว็บที่โหลดอยู่ในปัจจุบัน (ฉันยังไม่ได้ทดสอบด้วยคำขอ POST)


0

ฉันขอโทษที่จะบอกคุณ แต่สิ่งนี้ขัดต่อลักษณะปัจจุบันของการเรียกดูและการดีบักในเบราว์เซอร์ ...

แหล่งที่มาดั้งเดิมไม่ได้ถูกเก็บไว้ในหน่วยความจำ แต่จะถูกวิเคราะห์และแปลงเป็นแผนผังการแยกโดยเร็วที่สุดเพื่อป้องกันการใช้หน่วยความจำที่ไร้ประโยชน์ ดังนั้นข้อมูลการแก้ไขข้อบกพร่องใด ๆ ที่คุณซ่อนในแหล่งที่มาจะหายไปและต้องได้รับการร้องขออย่างชัดเจน ในเว็บไซต์ที่เรียกว่า Web 2.0 องค์ประกอบก็เปลี่ยนแปลงและนั่นคือเหตุผลที่การตรวจสอบเป็นเช่นนั้น ...

โซลูชันที่ 1: Fiddler Web Debuggerอนุญาตให้คุณตรวจสอบทราฟฟิก HTTP ซึ่ง
จะช่วยให้คุณเห็นข้อมูลการดีบักจากคำขอล่าสุดของคุณ

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


13
TomWij "สิ่งนี้ขัดต่อธรรมชาติในปัจจุบันของการสืบค้นและการดีบั๊กในเบราว์เซอร์ ... " มันไม่ถูกต้องธรรมดา Firefox และ Safari เวอร์ชันปัจจุบันทั้งสองทำงานเหมือน "คาดหวัง" อันที่จริงแล้วเนื่องจากฉันเคยใช้คุณสมบัติเหล่านี้ในเบราว์เซอร์อื่นฉันจึงคาดหวังได้เลยว่าพวกมันใน Chrome การเก็บข้อความธรรมดาสองถึงสามกิโลไว้สำหรับแหล่งต้นฉบับในหน่วยความจำนั้นไม่ยาก
macek

Google Chrome เป็นที่รู้จักสำหรับความเรียบง่าย ;-)
Tamara Wijsman

3
นี่เป็นความเท็จที่พิสูจน์ได้ ใน Chrome คุณสามารถบันทึกต้นฉบับดั้งเดิมของหน้า (บันทึกหน้าเป็น) โดยไม่ต้องทำคำขอที่สอง นี่คือสิ่งที่ควรแสดงเมื่อฉัน "ดูแหล่งที่มา" การใช้งานในปัจจุบันไม่พึงประสงค์อย่างมาก ตัวอย่างเช่นเมื่อดูผลลัพธ์ของ POST มุมมองปัจจุบันทำให้ GET ไปยังตำแหน่งเดียวกันโดยแสดงหน้าเว็บที่แตกต่างอย่างสิ้นเชิง แหล่งที่มาของมุมมองควรแสดงสถานะของหน้าเว็บที่คำขอปัจจุบันไม่ใช่คำขอในอนาคต
Chris

6
ไม่ต้องสงสัยเลยและนั่นคือที่มาของมุมมองที่ควรอ่านด้วย คำขอใหม่นั้นทำให้เข้าใจผิดและผิด
Chris

2
@Jonz คุณกำลังจะลบฟังก์ชั่น View Source ทั้งหมดหรือไม่? ฉันต้องการสนับสนุนสิ่งนี้หากทางเลือกเดียวคือการใช้งานไม่ได้ในปัจจุบัน แต่ทำไมเราถึงไม่มีทั้งคู่? การคลิกผ่านบันทึกเครือข่ายในแถบเครื่องมือ dev เป็นตัวเลือกที่ยอดเยี่ยมเมื่อคุณต้องการข้อมูลในระดับนั้น แต่ถ้าคุณต้องการเห็นแหล่งที่มาของหน้าปัจจุบันดูเหมือนว่าเกินขีด
Chris
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.