Đang tải tài nguyên xuống ở dạng HTML5 - a[tải xuống]

Chrome hiện hỗ trợ thuộc tính download mới của thông số HTML cho các phần tử a. Khi được sử dụng, thuộc tính này biểu thị rằng tài nguyên mà nó trỏ đến cần được trình duyệt tải xuống thay vì điều hướng đến tài nguyên đó.

Trong phần Đang tải tài nguyên xuống:

Ví dụ: nhấp vào liên kết sau sẽ tải xuống .png dưới dạng "MyGoogleLogo.png" thay vì điều hướng đến giá trị href: tải xuống tôi. Mã đánh dấu cho thuộc tính này như sau:

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

Lợi ích thực sự của a[download] sẽ là khi làm việc với các URL của blob: URLfilesystem: URL. Việc này sẽ giúp người dùng tải nội dung được tạo/sửa đổi trong ứng dụng của bạn xuống.

Bản minh hoạ đầy đủ

Một điều cần lưu ý là trong ví dụ trên, hình ảnh có cùng nguồn gốc với trang web. Nếu bạn cố sử dụng đường liên kết đến hình ảnh từ nguồn khác, thì đường liên kết đó có thể không hoạt động dưới dạng đường liên kết điều hướng thay vì đường liên kết tải xuống. Điều này là do nhiều phiên bản trình duyệt không hỗ trợ chính sách tải xuống trên các tệp có nhiều nguồn gốc. Ví dụ: Các phiên bản Chrome trước phiên bản 65 cho phép tải các tệp trên nhiều nguồn gốc xuống nhưng tính năng này không còn được dùng trong các phiên bản sau này. Hãy đọc bài viết này để biết thêm chi tiết. Bạn có thể sử dụng tiêu đề Content-Disposition để buộc tải xuống từ nguồn gốc khác.

Hỗ trợ trình duyệt: chỉ bản phát hành kênh phát triển Chrome hiện tại (14.0.835.15+) mới hỗ trợ thuộc tính này.