การดาวน์โหลดทรัพยากรในรูปแบบ HTML5 - a[ดาวน์โหลด]

ตอนนี้ Chrome รองรับแอตทริบิวต์ download ใหม่ของข้อกำหนด HTML ในองค์ประกอบ a แล้ว เมื่อใช้ แอตทริบิวต์นี้จะระบุว่าควรดาวน์โหลดทรัพยากรที่เบราว์เซอร์ชี้ไป แทนที่จะไปยังทรัพยากรดังกล่าว

จากการดาวน์โหลดทรัพยากร ให้ทำดังนี้

ตัวอย่างเช่น การคลิกลิงก์ต่อไปนี้จะดาวน์โหลด .png เป็น "MyGoogleLogo.png" แทนการไปที่ค่า href: ดาวน์โหลดฉัน มาร์กอัปสำหรับกรณีนี้มีดังนี้

<a href="http://web-central.appspot.com/.../web-fundamentals-icon192x192.png" download="WebfundamentalsLogo">download me</a>

ประโยชน์ที่แท้จริงของ a[download] คือเมื่อทำงานกับ blob: URL และ filesystem: URL URL โดยช่วยให้ผู้ใช้ดาวน์โหลดเนื้อหาที่สร้าง/แก้ไขภายในแอปได้

การสาธิตเต็มรูปแบบ

สิ่งหนึ่งที่ควรทราบคือ ในตัวอย่างข้างต้น รูปภาพมีที่มาเดียวกันกับเว็บไซต์ หากคุณพยายามใช้ลิงก์ของรูปภาพจากต้นทางอื่น ลิงก์นั้นอาจใช้เป็นลิงก์นำทางไม่ใช่ลิงก์ที่กำลังดาวน์โหลด เนื่องจากเบราว์เซอร์หลายเวอร์ชันไม่รองรับนโยบายการดาวน์โหลดในไฟล์ข้ามต้นทาง ตัวอย่างเช่น Chrome เวอร์ชันก่อน 65 อนุญาตให้ดาวน์โหลดไฟล์แบบข้ามต้นทางได้ และได้มีการเลิกใช้งานในเวอร์ชันต่อๆ ไป อ่านรายละเอียดเพิ่มเติมได้ในบทความนี้ คุณใช้ส่วนหัว Content-Disposition เพื่อบังคับให้ดาวน์โหลดจากต้นทางอื่นได้

การรองรับเบราว์เซอร์: เฉพาะ Chrome Dev เวอร์ชันปัจจุบัน (14.0.835.15+) เท่านั้นที่รองรับแอตทริบิวต์นี้