前端Uncaught (in promise) 的解決方法及原因
阿新 • • 發佈:2021-06-10
問題:在Vue專案中使用axios呼叫一個第三方的介面時,前端無法獲取到介面返回值,檢查控制檯Network發現介面請求已經正常發出並且有資料返回,但是控制檯Console報了這麼一個錯誤
上圖可以看到介面請求正常響應並有返回,控制檯卻一直報錯Uncaught (in promise)
排查一番之後發現,是介面響應攔截器裡面的問題,原本封裝好的請求方法裡面response.data.code == 0才算請求成功,因為我們自己這邊的介面請求成功時響應的code值為0,但是今天訪問的是第三方的介面,這個介面請求成功時返回的code值為200,從上圖可看出,所以這個請求的響應被攔截掉了,從而Promise.reject(rejection)報錯。
解決辦法:修改攔截器裡面的判斷,將code為200也視為成功(這裡根據實際介面返回做修改)
axios.interceptors.reponse.use(res => { // 請求成功對響應資料做處理,此處返回的資料是axios.then(res)中接收的資料 if (res.code ==0 || res.code == 200) { // code值為 0 或 200 時視為成功 return Promise.resolve(res) } return Promise.reject(res) }, err => { // 在請求錯誤時要做的事兒 ...// 此處返回的資料是axios.catch(err)中接收的資料 return Promise.reject(err) })
修改完之後,前端就能正常拿到介面的返回值了。
以上方法可供參考,可能還有其他造成這個報錯的原因