一、當(dāng)我們前端調(diào)用導(dǎo)出文件接口時，一般情況都會在請求里添加responseType為blob

前幾天遇到一個問題，后端人員 的這個接口會分別出現(xiàn)兩種情況：

1、當(dāng)導(dǎo)出接口請求正常時，我們前端會收到一個文件流如下圖

 這時我們打印一下接口返回的數(shù)據(jù)類型，發(fā)現(xiàn)接口會返回一個blob類型的數(shù)據(jù)，并且blob中屬性type是application/vnd.ms-excel，這就說明我們導(dǎo)出的文件類型是excel格式的。如下圖 

BLOB (binary large object)----二進(jìn)制大對象，是一個可以存儲二進(jìn)制文件的容器。

說白了blob就是一個二進(jìn)制的對象，我們可以通過這個blob對象直接讀取文件內(nèi)容，但是這時多次一舉，我們只需要把相應(yīng)的blob對象直接以a標(biāo)簽導(dǎo)出就可以了，如下圖：

 2、當(dāng)導(dǎo)出接口數(shù)據(jù)過多后端拋出異常時，如下圖 

這時我們在瀏覽器控制臺打印出結(jié)果，返現(xiàn)結(jié)果還是一個blob對象，但是type變成application/json

 我們想要得到接口返回的結(jié)果，需要對blob對象進(jìn)行文件讀取，我們需要用到 FileReader

FileReader  對象允許 Web 應(yīng)用程序異步讀取存儲在用戶計算機上的文件（或原始數(shù)據(jù)緩沖區(qū)）的內(nèi)容，使用 File 或 Blob 對象指定要讀取的文件或數(shù)據(jù)。

我們可以根據(jù)blob對象的type屬性來判斷,當(dāng)type為application/json時，接口返回的時一個json對象

其中reader.result就是接口返回的結(jié)果，是一個json字符串需要轉(zhuǎn)換成對象。 

總結(jié)

到此這篇關(guān)于前端文件導(dǎo)出設(shè)置responseType為blob時遇到的問題及解決的文章就介紹到這了,更多相關(guān)前端文件導(dǎo)出responseType為blob內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論