Tải xuống nội dung văn bản dưới dạng tệp chỉ sử dụng Javascript (không có phía máy chủ)

Question

Tôi đang được yêu cầu thực hiện nút "tải xuống" tải xuống nội dung của vùng văn bản trên cùng một trang với tệp, với "Lưu dưới dạng của trình duyệt ... "hộp thoại hiện lên. Sao chép/dán sẽ làm công việc tốt, nhưng nó là một "yêu cầu".

Ngay bây giờ, tôi chỉ đăng nội dung của vùng văn bản lên máy chủ, điều này lặp lại chúng với Content-disposition: attachment được bật lên. Có cách nào để làm điều này chỉ với Javascript phía máy khách?

Answer 1

Câu trả lời ngắn gọn: điều này không rõ ràng. Bạn phải POST nó lên máy chủ và phản hồi từ máy chủ có thể là "Bố cục nội dung: tệp đính kèm".

Answer 2

Bạn có thể thử window.location = "data:application/octet-stream,"+text nhưng không cung cấp cơ chế mà bạn có thể đề xuất tên và IE có một nắp rất nhỏ trên chiều dài tối đa của URI dữ liệu có thể là vấn đề.

Answer 3

Nó thể thể bằng cách tạo ra một khung hình, viết nội dung ở đó, sau đó gọi document.execCommand('saveas', ...) trong IE và một cái gì đó với nsIFilePicker trong Mozilla, nhưng tôi tin rằng sẽ yêu cầu một số đặc quyền đặc biệt (như là một phần của bản thân trình duyệt) .

Answer 4

Có một số thư viện javascript đã thực hiện loại điều này, thông qua tệp SWF nhúng nhỏ. Ví dụ: this one.

Answer 5

Tôi tìm thấy một giải pháp đơn giản ở đây: http://www.codingforums.com/archive/index.php/t-181561.html

My text area:<br /> 
<textarea rows='10' cols='80' id='myTextArea' ></textarea> 

<br /><br /> 

Download button: <br /> 
<input value='download' type='button' 
onclick='doDL(document.getElementById("myTextArea").value)' /> 


<script type='text/javascript'> 
function doDL(s){ 
    function dataUrl(data) {return "data:x-application/text," + escape(data);} 
    window.open(dataUrl(s)); 
} 
</script> 

Hy vọng nó sẽ giúp.

Answer 6

Đây có thể là những gì bạn đang tìm kiếm: http://thiscouldbebetter.wordpress.com/2012/12/18/loading-editing-and-saving-a-text-file-in-html5-using-javascrip/

Nó sử dụng đối thoại download của trình duyệt, nhưng chỉ hỗ trợ FF và Chrome, trình duyệt và có thể nhiều hơn bây giờ?

---

Edit:

Như nhận xét tôi sẽ nhúng mã từ bài viết:

function saveTextAsFile() 
{ 
    var textToWrite = //Your text input; 
    var textFileAsBlob = new Blob([textToWrite], {type:'text/plain'}); 
    var fileNameToSaveAs = //Your filename; 

    var downloadLink = document.createElement("a"); 
    downloadLink.download = fileNameToSaveAs; 
    downloadLink.innerHTML = "Download File"; 
    if (window.webkitURL != null) 
    { 
     // Chrome allows the link to be clicked 
     // without actually adding it to the DOM. 
     downloadLink.href = window.webkitURL.createObjectURL(textFileAsBlob); 
    } 
    else 
    { 
     // Firefox requires the link to be added to the DOM 
     // before it can be clicked. 
     downloadLink.href = window.URL.createObjectURL(textFileAsBlob); 
     downloadLink.onclick = destroyClickedElement; 
     downloadLink.style.display = "none"; 
     document.body.appendChild(downloadLink); 
    } 

    downloadLink.click(); 
} 

Answer 7

Hoàn toàn có thể sử dụng cross trình duyệt thực hiện JavaScript của hàm HTML5 saveAs này: https://github.com/koffsyrup/FileSaver.js

Nếu tất cả những gì bạn muốn làm là lưu văn bản thì tập lệnh trên hoạt động trong tất cả các trình duyệt (bao gồm tất cả các phiên bản của IE), không yêu cầu SWF.