Tải xuống dữ liệu URL 'dữ liệu: văn bản/đơn giản'

Question

Tôi đã tự hỏi liệu có thể buộc trình duyệt (ít nhất Chrome) tải xuống URL data:text/plain hay không.

Chrome tải xuống các URL nhị phân (ví dụ: data:application/zip;base64,...), nhưng không tải xuống các tệp có thể xem trong trình duyệt (chẳng hạn như tệp văn bản).

Những gì tôi đã cố gắng không có may mắn cho đến nay là thế này:

data:text/plain;content-disposition=attachment;filename=test.txt;... 

Nhưng nó có vẻ như tôi không thể thêm tiêu đề như thế này.

Có cách nào để làm cho Chrome tải xuống URL data:text/plain,... không?

Answer 1

Hiện tại, bạn có thể sử dụng <a download> trong Chrome. Sử dụng dispatchEvent, bạn có thể tải xuống bất kỳ chuỗi nào dưới dạng tệp (ngay cả với tên tệp tùy chỉnh) bất cứ khi nào bạn muốn. Dưới đây là một chức năng tiện ích để sử dụng nó:

var downloadFile = function(filename, content) { 
    var blob = new Blob([content]); 
    var evt = document.createEvent("HTMLEvents"); 
    evt.initEvent("click"); 
    $("<a>", { 
    download: filename, 
    href: webkitURL.createObjectURL(blob) 
    }).get(0).dispatchEvent(evt); 
}; 

Cách sử dụng:

downloadFile("foo.txt", "bar"); 

Nó sử dụng jQuery và webkit tiền tố, nhưng cả hai đều có thể tránh được.

Answer 2

Những gì tôi đã làm được gửi dữ liệu đến một máy chủ, gửi chúng trở lại với tiêu đề HTTP sau:

Content-disposition: attachment;filename=test.txt 

tôi không thích điều này, nhưng nó hoạt động khá tốt.

Answer 3

Try this: 
<a download="file_downloaded_via_data_URL.txt" 
href="data:text/plain;base64,SGVsbG8sIHdvcmxkISBJJ20gZG93bmxvYWRlZCB2aWEgImRhdGE6dGV4dC9wbGFpbjsuLi4iIFVSTCB1c2luZyA8YSBkb3dubG9hZD0iZmlsZV9uYW1lIi4uLj4uDQpNeSBiaXJ0aHBsYWNlOiBodHRwOi8vc3RhY2tvdmVyZmxvdy5jb20vcXVlc3Rpb25zLzY0Njg1MTcvDQoNCk1vcmUgYWJvdXQ6DQpodHRwOi8vd3d3LnczLm9yZy9UUi9odG1sL2xpbmtzLmh0bWwjYXR0ci1oeXBlcmxpbmstZG93bmxvYWQNCmh0dHA6Ly93d3cudzMub3JnL1RSL2h0bWwvbGlua3MuaHRtbCNkb3dubG9hZGluZy1yZXNvdXJjZXMNCg0KQnJvd3NlciBzdXBwb3J0OiBodHRwOi8vY2FuaXVzZS5jb20vZG93bmxvYWQ="> 
    Download text file 
</a> 

Sử dụng thuộc tính HTML5 download="filename.ext". (Không JS cần thiết :)

Thông tin thêm về: http://www.w3.org/TR/html/links.html#downloading-resources

Hỗ trợ trình duyệt có thể được kiểm tra tại http://caniuse.com/download

(Như bây giờ, năm 2013, không có IE cũng không hỗ trợ Safari)

Tôi nghĩ rằng, bạn có thể tạo dự phòng cho các trình duyệt không hỗ trợ: sử dụng JS để thay đổi giá trị href="..." thành URL của tập lệnh máy chủ của bạn (sẽ trả về nội dung tệp có tiêu đề HTTP thích hợp Content-disposition: attachment;filename=filename.txt).

Answer 4

này hoạt động như là địa ngục ...

<div class="tags-style-one dragme" draggable="true" data-transfer="33343">some value is 33343</div> 

    <script type="text/javascript"> 
    (function ($) { 
     $(document).ready(function() { 
     $('.dragme').on("dragstart",function(evt) { 
      evt.originalEvent 
        .dataTransfer 
        .setData(
          "text/plain", 
          $(this).data('transfer').toString() 
        ); 
     }); 
    })(jQuery); 
</script>