使用XMLHttpRequest下載文件

我很難實現一個簡單的文件下載腳本。
這是我到目前爲止，確定工作：使用XMLHttpRequest下載文件

打開一個XMLHttpRequest
獲取遠程文件作爲BLOB二進制
顯示下載進度

我的問題是：

創建自定義下載目錄
將下載的文件重命名爲原始源名稱
下載的文件不包括其擴展名
可以在下載前添加選項以提示保存位置嗎？

這是片段：

$('#DownloadBtn').click(function(e) { 

     e.preventDefault(); 

     var urlFile = $(this).attr('href'); // remote file www.blabla.com/soft123.bin 
     var fileName = ''; // Get remote file name & extension ? 

     var progressBar = document.querySelector('progress'); 

     window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem; 

     function onError(e) { 
      console.log('Error', e); 
     } 

     var xhr = new XMLHttpRequest(); 
     xhr.addEventListener("progress", updateProgress, false); 
     xhr.open('GET', urlFile, true); 
     xhr.responseType = 'blob'; 
     var resourceDIRLOC = "Downloads"; 
     xhr.onload = function(e) { 
      window.requestFileSystem(TEMPORARY, 10 * 1024 * 1024, function(fs) { 
       fs.root.getDirectory(fs.root.fullPath + '/' + resourceDIRLOC, { 
        create: true 
       }, function(dir) { 
        resourceDIR = dir; 
        fs.root.getFile(fileName, { 
         create: true 
        }, function(fileEntry) { 
         fileEntry.createWriter(function(writer) { 
          writer.onwrite = function(e) {}; 
          writer.onerror = function(e) {}; 
          var blob = new Blob([xhr.response], { 
           type: ' application/octet-stream' 
          }); 

          writer.write(blob); 
         }, onError); 
        }, onError); 
       }, onError); 
      }, onError); 
     }; 

     function updateProgress(e) { 
      if (e.lengthComputable) { 
       $(progressBar).show(); 
       var i = (e.loaded/e.total) * 100; 
       progressBar.value = i; 
       if (i == 100) { 
        $(progressBar).hide(); 
       } 
      } 
     } 
     xhr.send(); 
    });

下載的文件位於FileSystem->000->t下與00姓名（不soft123.bin）

我不知道是否有可能給予用戶可以選擇在FileSystem之外選擇下載目錄？如上面定義的，目標目錄resourceDIRLOC = "Downloads"但請求沒有創建這個文件夾？既沒有給文件名和擴展名
任何建議表示讚賞
感謝

來源

2014-05-04 Awena

你可以試試[這]（http://johnculviner.com/jquery-file-download-plugin-for-ajax-like-feature-rich-file-downloads/ ） – xiidea

如何使用Javascript在文檔中描述如何在http頭中寫入cookie？它是否應該添加到HTML文檔標題中？ – Awena

庫假定可下載的文件將通過服務器端腳本（如php/asp等）提供。 – xiidea

這裏是你如何跟蹤下載進度，並與節點Webki選擇下載目錄。我首先嚐試使用XMLHttpRequest進行下載，以便監視下載進度，但我在FileSystem API方面遇到了困難。這只是我想做的工作，一個簡單的文件下載與進度條。希望它有幫助。

function download(file_url) { 
    var fs = require('fs'); 
    var url = require('url'); 
    var http = require('http'); 
    var options = { 
     host: url.parse(file_url).host, 
     port: 80, 
     path: url.parse(file_url).pathname 
    }; 
    var file_name = url.parse(file_url).pathname.split('/').pop(); 
    var file = fs.createWriteStream('./' + file_name); 
    http.get(options, function(res) { 
     var fsize = res.headers['content-length']; 
     res.on('data', function(data) { 
      file.write(data); 
      progress(100 - (((fsize - file.bytesWritten)/fsize) * 100), $('#progressBar')); 
     }).on('end', function() { 
      file.end(); 
     }); 
    }); 
} 

function progress(percent, $element) { 
    console.log("Download: " + parseInt(percent) + " %") 
    var progressBarWidth = percent * $element.width()/100; 
    $element.find('div').css("width", progressBarWidth); 
}

答發現here

來源

2014-05-04 22:00:25 Awena

使用XMLHttpRequest下載文件

回答

相關問題