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

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

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

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

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

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

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

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

การรองรับเบราว์เซอร์: เฉพาะ Chrome เวอร์ชันที่กำลังพัฒนาในปัจจุบัน (14.0.835.15 ขึ้นไป) เท่านั้นที่รองรับแอตทริบิวต์นี้