จาวาสคริปต์ - การล้างแคชผ่านพารามิเตอร์

เราต้องการทำ cache bust เมื่อมีการ deploy ใน production แต่ไม่อยากเสียเวลามากในตอนแรกในการหาวิธีสำหรับการทำเช่นนั้น ความคิดของฉันคือการเพิ่มพารามิเตอร์ที่ส่วนท้ายของไฟล์ css และ js พร้อมกับหมายเลขเวอร์ชันปัจจุบัน:

<link rel="stylesheet" href="base_url.com/file.css?v=1.123"/>

สองคำถาม: สิ่งนี้จะทำให้แคชเสียหายอย่างมีประสิทธิภาพหรือไม่? พารามิเตอร์นี้จะทำให้เบราว์เซอร์ไม่เก็บแคชการตอบสนองจาก URL นั้นอีกหรือไม่ เนื่องจากพารามิเตอร์นี้บ่งชี้ว่านี่คือเนื้อหาแบบไดนามิก?

คำตอบ #1

พารามิเตอร์ ?v=1.123 บ่งบอกถึงสตริงการสืบค้น (query string) ดังนั้นเบราว์เซอร์จึงจะคิดว่ามันเป็นเส้นทางใหม่ จาก, เช่น, ?v=1.0 ดังนั้นทำให้มันโหลดจากไฟล์ ไม่ใช่จากแคช ตามที่คุณต้องการ

และ เบราว์เซอร์จะถือว่าที่มาจะคงที่ในครั้งถัดไปที่คุณเรียก ?v=1.123 และ ควร แคชมันด้วยสตริงนั้น ดังนั้นมันจะคงอยู่ในแคช ไม่ว่าจะตั้งค่าเซิร์ฟเวอร์ของคุณอย่างไร จนกว่าคุณจะเปลี่ยนไปใช้ ?v=1.124 หรืออื่น ๆ ต่อไป

คำตอบ #2

สองคำถาม: สิ่งนี้จะทำให้แคชเสียหรือไม่?

ใช่ แม้กระทั่ง Stack Overflow ก็ใช้วิธีนี้ แม้ว่าฉันจะจำได้ว่าพวกเขา (ที่มีผู้เยี่ยมชมหลายล้านต่อวันและมีลูกค้าและเวอร์ชันพร็อกซี่ที่แตกต่างกันมากมาย รวมถึงการตั้งค่าต่าง ๆ) เคยมีกรณีพิเศษแปลก ๆ ที่แม้ว่าวิธีนี้ก็ยังไม่เพียงพอที่จะทำให้แคชหลุด แต่สมมติฐานทั่วไปคือวิธีนี้จะใช้ได้ และเป็นวิธีที่เหมาะสมในการทำให้แคชบนฝั่งลูกค้าหลุด

พารามิเตอร์นี้จะทำให้เบราว์เซอร์ไม่ต้องเก็บแคชการตอบสนองจาก URL นั้นใช่ไหม เนื่องจากพารามิเตอร์บ่งบอกว่านี่คือเนื้อหาแบบไดนามิก?

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

คำตอบ #3

การใส่หมายเลขเวอร์ชันในชื่อไฟล์จริงนั้นปลอดภัยกว่า ซึ่งจะช่วยให้มีหลายเวอร์ชันอยู่พร้อมกัน ดังนั้นคุณสามารถเปิดตัวเวอร์ชันใหม่ได้ และถ้ามีหน้า HTML ที่แคชไว้แล้วซึ่งยังร้องขอเวอร์ชันเก่าอยู่ พวกเขาจะได้รับเวอร์ชันที่ทำงานได้กับ HTML ของพวกเขา

โปรดทราบว่า ในหนึ่งในการปรับใช้ที่มีเวอร์ชันใหญ่ที่สุดที่ใดก็ได้บนอินเทอร์เน็ต jQuery ใช้หมายเลขเวอร์ชันในชื่อไฟล์จริง และมันอนุญาตให้มีหลายเวอร์ชันอยู่ร่วมกันได้อย่างปลอดภัยโดยไม่ต้องมีตรรกะด้านเซิร์ฟเวอร์พิเศษใด ๆ (แต่ละเวอร์ชันเป็นเพียงไฟล์ที่แตกต่างกัน)

นี่จะล้างแคชครั้งหนึ่งเมื่อคุณปรับใช้หน้าหรือไฟล์ลิงก์ใหม่ (ซึ่งเป็นสิ่งที่คุณต้องการ) และจากนั้นเวอร์ชันเหล่านั้นสามารถถูกแคชได้อย่างมีประสิทธิภาพ (ซึ่งคุณก็ต้องการเช่นกัน)

คำตอบ #4

อย่างที่คนอื่นได้กล่าวไว้ การทำ cache busting ด้วยพารามิเตอร์ query มักจะถือว่าเป็นความคิดที่ไม่ดี (tm) และเป็นแบบนี้มานานแล้ว การสะท้อนเวอร์ชันในชื่อไฟล์นั้นดีกว่า Html5 Boilerplate แนะนำให้หลีกเลี่ยงการใช้ query string เป็นต้น

อย่างไรก็ตาม จากคำแนะนำที่ฉันเคยเห็นซึ่งมีการอ้างอิงแหล่งที่มา ทุกคำแนะนำดูเหมือนว่าจะได้รับข้อมูลจากบทความปี 2008 ของสตีฟ ซาวเดอร์ส ข้อสรุปของเขาขึ้นอยู่กับพฤติกรรมของพร็อกซี่ในเวลานั้น และอาจเกี่ยวข้องหรือไม่เกี่ยวข้องกับปัจจุบันก็ได้ อย่างไรก็ตาม ในกรณีที่ไม่มีข้อมูลปัจจุบัน การเปลี่ยนชื่อไฟล์ถือเป็นทางเลือกที่ปลอดภัย

คำตอบ #5

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