天天看點

vue axios post報400,傳回兩次錯誤資訊

最近用vue 2.x + axios請求時,請求報400時,請求會報兩次錯誤,相應攔截器會走兩次,就是請求一次,相應攔截器會走兩次;主要是隻有請求報錯時才會出現這個問題,請求200就不會出現問題。

之前把問題發到了思否上,現在整過來記錄下

這是我在main.js裡面設定的響應攔截器:

axios.interceptors.response.use(function(res) {
        console.log("success");
    }, function(err) {
        console.log(err); // 列印錯誤日志
        if (err.response && err.response.status == 401) {
            router.replace({
                path: '/login',
                query: {
                    redirect: to.fullPath
                } // 将跳轉的路由path作為參數,登入成功後跳轉到該路由
            });
        } else if (err.response && err.response.status) {
            return Promise.reject(err.response && err.response.data); // 傳回接口傳回的錯誤資訊
        }
    });
           

下面是頁面代碼

vue axios post報400,傳回兩次錯誤資訊

我隻發了一次請求,下面是控制台列印

下面是頁面請求報400時,error有兩次列印,不知道為什麼?

背景傳回的是第二次列印,請問第一次列印是什麼回事?

我打斷點看了,确實是進入了兩次錯誤列印。

vue axios post報400,傳回兩次錯誤資訊

下面這個是背景傳回

vue axios post報400,傳回兩次錯誤資訊

下面補上正确的頁面展示

vue axios post報400,傳回兩次錯誤資訊

再下面補上頁面不正常,抽風了的展示,代碼是同一套,你重新整理下頁面,錯誤展示又是上面正确的展示,搞瘋人了

下面這個是錯誤提示,不能識别data,打斷點看是responseerror走了兩次的問題

vue axios post報400,傳回兩次錯誤資訊

最後,我用fetch請求來規避這個問題

我懷疑是axios插件的問題,我換成fetch請求就沒出現這個問題了;我就暫時這樣規避,之後有大佬知道怎麼解決,還請告知下,謝謝!

vue axios post報400,傳回兩次錯誤資訊

有大佬知道如何解決這個問題,還請告知,謝謝!

下面是之前思否的原帖記錄:

連結: 本人原帖.

繼續閱讀