使用 vuejs 從 nodejs 下載 zip 文件

Question

我正在嘗試使用 vuejs 從 nodejs 下載 zip 文件。

我的問題是出現對話框時文件名周圍有一個奇怪的下划線。

如果我手動設置：

const fileName="xmlFile.zip";

我沒有問題。

我附上了問題的圖片。

這是從節點返回的標頭：

Accept-Ranges: bytes
Access-Control-Allow-Origin: *
Access-Control-Expose-Headers: Content-Disposition
Cache-Control: public, max-age=0
Connection: keep-alive
Content-Disposition: attachment; filename="xmlFile.zip"
Content-Length: 164
Content-Type: application/zip
Date: Sun, 19 Jul 2020 13:55:15 GMT
ETag: W/"a4-17367574de4"
Last-Modified: Sun, 19 Jul 2020 13:50:41 GMT
X-Powered-By: Express

我究竟做錯了什么？

 //vuejs front end
        let response = await axios.post('/generateLoteXMLZIPConsulta');;
        let blob = await new Blob([response.data], {
          type: "application/zip",
        });
        const link = document.createElement("a");
        link.style.display = "none";
        link.href = window.URL.createObjectURL(blob);
        const fileName = response.headers["content-disposition"].match(
          /filename=(.*)/
        )[1];
        link.download = fileName;
        link.click();
        window.URL.revokeObjectURL(link.href);

 //backend nodejs
 router.post("/generateLoteXMLZIPConsulta", async (req, res) => {
    ....
    ....
    res.download(
            path.resolve(__dirname, "../../file.zip"),
            "xmlFile.zip"
    );
})      

Answer 1

在查看了您的其他詳細信息后，我認為添加下划線是因為您的正則表達式，它似乎也捕獲了雙引號。

根據您的詳細信息，響應 header 內容為：

Content-Disposition: attachment; filename="xmlFile.zip"

然后你像這樣提取它：

const fileName = response.headers["content-disposition"].match(
          /filename=(.*)/
        )[1];

嘗試登錄控制台fileName 。 我認為這需要去掉雙引號。