最近看到很多前端的小伙伴們,需要從服務(wù)器端下載諸如excel,word,pdf的文件,但是在處理時怎么也沒法產(chǎn)生想要的效果(點擊后立即下載文件),而是沒有任何響應(yīng),查看控制臺發(fā)現(xiàn)返回的數(shù)據(jù)是一片亂碼,結(jié)合自己的經(jīng)驗,希望能給大家一些幫助。
我這里ajax請求使用VUE的常用小伙伴axios,怎么用axios我就不詳細(xì)介紹了,不會的小伙伴請看這里
this.$http.post("/outputExcel",{ //Content_Type:"Authorization", // excelData:JSON.stringify(this.tableData),可以付帶一些參數(shù) }).then((res)=> { console.log(res.data.filePath) //正常情況下返回值是excel文件的下載路徑 this.excelpath="http://127.0.0.1:3000/download/"+res.data.filePath; window.open(this.excelpath) })
以上代碼配合服務(wù)器端實現(xiàn)文件下載,但需要注意的是,服務(wù)器端不是返回文件,而是返回文件的路徑res.data.filePath。比如我這里的文件存放在服務(wù)器端download文件夾下。
取得路徑后使用window.open()方法獲取文件,同時服務(wù)器端應(yīng)該有相應(yīng)的處理程序,處理這個get請求:
我服務(wù)器端使用的express: 代碼大致如下:
var express = require("express"); var path= require("path") var router = express.Router(); router.get("/:filename", function(req, res, next) { var filename=req.params.filename; var file=path.join(__dirname,"../download/"+filename) res.download(file) }) module.exports = router;
重點就是,不要直接返回文件,而是通過訪問文件路徑的方式進(jìn)行下載;** 如果你還有什么疑問,或者更好的辦法,可以留言互相學(xué)習(xí)交流。
-
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://m.hztianpu.com/yun/107337.html
摘要:當(dāng)前有一個需求前端對當(dāng)前頁面的數(shù)據(jù)做篩選之后需要將其導(dǎo)出至文件且發(fā)送的請求需傳入需驗證的參數(shù)如頁面信息嘗試了提交及其他方法后出現(xiàn)亂碼等問題最后用成功完成了導(dǎo)出。直接貼代碼下面是解釋這段代碼不加會導(dǎo)致導(dǎo)出的出現(xiàn)亂碼問題。 當(dāng)前有一個需求 前端對當(dāng)前頁面的數(shù)據(jù)做篩選之后需要將其導(dǎo)出至excel文件且發(fā)送的請求需傳入需驗證的參數(shù)如頁面token信息嘗試了form提交及其他方法后出現(xiàn)excel...
摘要:方式請求的數(shù)據(jù)只能存放在內(nèi)存空間,可以通過訪問,但是無法保存到硬盤,因為不能直接和硬盤交互,否則將是一個安全問題。是第一個第三方的庫,所以同理。這里是返回的對象這里表示類型創(chuàng)建下載的鏈接下載后文件名點擊下載下載完成移除元素釋放掉對象 前言 我的項目中有一個需求:點擊按鈕生成可編輯的word文檔訂單詳情的信息我使用的前端框架是Vue.js、后臺使用的是node.jsnode.js生成和導(dǎo)...
摘要:性能會有所降低一點內(nèi)容,刷新整個頁面用戶的操作頁面會中斷整個頁面被刷新了就是能夠做到局部刷新三對象是中最重要的一個對象。頭信息已經(jīng)接收,響應(yīng)數(shù)據(jù)尚未接收。 一、什么是Ajax Ajax(Asynchronous JavaScript and XML) 異步JavaScript和XML Ajax實際上是下面這幾種技術(shù)的融合: (1)XHTML和CSS的基于標(biāo)準(zhǔn)的表示技術(shù) (2)DOM進(jìn)...
摘要:更多文章平時在前端下載文件有兩種方式,一種是后臺提供一個,然后用下載,另一種就是后臺直接返回文件的二進(jìn)制內(nèi)容,然后前端轉(zhuǎn)化一下再下載。假設(shè)是返回來的二進(jìn)制數(shù)據(jù)這次沒有問題,文件能正常打開,內(nèi)容也是正常的,不再是亂碼。 更多文章 平時在前端下載文件有兩種方式,一種是后臺提供一個 URL,然后用 window.open(URL) 下載,另一種就是后臺直接返回文件的二進(jìn)制內(nèi)容,然后前端轉(zhuǎn)化一...
閱讀 2430·2021-11-15 11:38
閱讀 3617·2021-09-22 15:16
閱讀 1256·2021-09-10 11:11
閱讀 3245·2021-09-10 10:51
閱讀 3072·2019-08-30 15:56
閱讀 2846·2019-08-30 15:44
閱讀 3241·2019-08-28 18:28
閱讀 3581·2019-08-26 13:36