前言

?? 今天業(yè)務(wù)提出了一個(gè)需求，導(dǎo)出要做次數(shù)限制，這個(gè)我先簡(jiǎn)單啊，后端接口改一下又限制的時(shí)候返回一個(gè)JSON對(duì)象包含Code和Msg，前端全局?jǐn)r截一下就ok了，那就開(kāi)干吧。后端接口調(diào)整好了，前端配置也好了，but前端沒(méi)攔截到，尷尬了。開(kāi)始排除吧，先把正常攔截的response打印出。

正常攔截的response

正常blob接口preview

下面是特殊情況返回JSON

特殊情況攔截的response

特殊情況blob接口preview

非blob格式的response

非blob格式的response

?? 自此我們發(fā)現(xiàn)responseType: 'blob', 返回的data都是Blob格式，而且特殊情況（即返回JSON）他的Blob 對(duì)象的type:"application/json"。所有我們的思路是先判斷是不是blob格式，然后判斷是不是特殊情況(json),在把blob格式轉(zhuǎn)成json對(duì)象，上代碼

if (Object.prototype.toString.call(response.data) === '[object Blob]') {  // 先判斷是不是blob格式
      if (response.data.type.includes('application/json')) {  // 判斷是不是特殊情況(json)
        let reader = new FileReader()
        reader.onload = function () {
          let res = reader.result
          let result = JSON.parse(res) // blob格式轉(zhuǎn)成json
          if (result.Code === 431) { // 導(dǎo)出超出限制
             // 對(duì)應(yīng)業(yè)務(wù)邏輯
          }
        }
        reader.readAsText(response.data)
      }
    }

總結(jié)

?? 如果幫助到你請(qǐng)給個(gè)贊哈，請(qǐng)copy黨手下留德，標(biāo)明來(lái)源，原創(chuàng)整理不易。