1. 程式人生 > >前端處理後臺傳過來的二進位制流進行下載,並處理亂碼

前端處理後臺傳過來的二進位制流進行下載,並處理亂碼

附上程式碼及註釋

        //注意請求的時候要加上{responseType:'blob'}引數
this.$axios.post("/api/xxx/xxx/xxx",this.$qs.stringify({range:0,}),{responseType:'blob'}).then(msg=>{
                console.log(msg.data) //打印出來是blob物件,已經不是亂碼了
                let url = window.URL.createObjectURL(msg.data); //表示一個指定的file物件或Blob物件
                console.log(url,"看一下這是啥")
                let a = document.createElement("a"); 
                document.body.appendChild(a);
                let fileName=msg.headers["content-disposition"].split(";")[1].split("=")[1];  //filename名稱擷取
                a.href = url;
                a.download = fileName; //命名下載名稱
                a.click(); //點選觸發下載  
                window.URL.revokeObjectURL(url);  //下載完成進行釋放
        })

特別注意:

在和後臺互動的時候,如果後臺返回給我們的是二進位制流資料,我們就要在傳送的時候加上{responseType:'blob'}這行程式碼,這樣返回給我們的就不是亂碼了。