[英]Push File Download on Ajax POST Nodejs Express
在節點服務器上我有這個代碼。 它基本上將瀏覽器 POST 數據發送到 api 服務器並接收文件作為塊數據,並且相同的數據通過 pipe 響應發送回瀏覽器。 但問題是 api 響應是正確的,我可以在本地使用 nodejs 編寫文件,但它不會在瀏覽器中推送下載文件
router.post('/MyURLOnNODE', function (req, res) {
var MyJsonData = { some Data };
res.writeHead(200, {'Content-disposition': 'attachment; filename=fileArchive.tgz','Content-Type': 'application/force-download'});
try {
request({
url: 'SomeAPI Url', //URL to hit
method: 'POST',
json: MyJsonData
}).pipe(res);
} catch(e) {
console.log("Pipe error",e);
}
console.log("File Streaming Called ",MyJsonData)
}
);
客戶端代碼...這是嘗試創建一個 blob 並在 urlObject 上使用它。 但是當我簽入十六進制時,下載的文件已損壞。
$http({
method: 'POST',
url: 'MyURLOnNODE',
data: PostData, //forms user object
headers: {
'Content-Type': 'application/json'
}
})
.then(function (data) {
var response=data.data;
var id = Flash.create('success', "Folder Archieved", 5000);
var a = document.getElementById('arch');
a.href = URL.createObjectURL(new Blob([response]));
a.download = "FolderMe.tgz";
a.type='application/octet-stream '
a.click();
}
那么有什么解決方案嗎? 在 NodeJs 端或瀏覽器上
更新: https://stackoverflow.com/a/7969061/7078299
該線程說很難將 ajax 請求轉換為下載文件。 所以我需要在客戶端上使用 urlobject。 但是 blob 不能使用 stream 數據。 如何解決
您可以使用名為file-saver
的節點模塊並使用它提供的saveAs
方法並在客戶端下載文件。
首先npm install file-saver
;
您可以將其用作
import {saveAs} from 'file-saver';
在您的then
塊中,您需要添加此行
saveAs(new Blob([response]), <your file name>)
它會自動下載您的文件。
我通過在客戶端代碼上添加一個響應類型來解決這個問題。 現在 blob 和 ObjectUrl 可以正常工作
$http({
method: 'POST',
url: 'MyUrl',
data: PostData, //forms user object
headers: {
'Content-Type': 'application/json'
},
responseType: 'arraybuffer'
})
.then(function (response) {
console.log(response);
var headers = response.headers();
var blob = new Blob([response.data],{type:headers['content-type']});
var link = document.createElement('a');
link.href = window.URL.createObjectURL(blob);
link.download = "Archive.tgz";
link.click();
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.