如何處理Axios中的net :: ERR_CONNECTION_REFUSED - Vue.js

Question

以下是我的連接請求代碼：

doLogin(this.login).then(response => {
        var token = response.data.token;
        localStorage.setItem('AUTH_TOKEN', JSON.stringify(token));
        this.$router.push({name: 'Devices'});
        });
      }).catch(error => {
        console.log(error.response.data.message);
      });

在catch()的一部分用於HTTP錯誤工作正常（如400 ， 404 ， 403 ..等）。 但是當我的服務器離線時，這個腳本只會拋出net::ERR_CONNECTION_REFUSED 。 有沒有辦法處理此錯誤並讓前端用戶知道服務器當前處於脫機狀態。

這是doLogin （）函數以防萬一，

function doLogin(data) {
  const url   = 'http://localhost:3000/authenticate';
  return axios.post(url,data);
}

Answer 1

你可以在catch部分嘗試這個：

catch(error => {
        if (!error.response) {
            // network error
            this.errorStatus = 'Error: Network Error';
        } else {
            this.errorStatus = error.response.data.message;
        }
      })

Answer 2

您可以像PanJunjie潘俊傑建議的那樣驗證自己，或者使用像sindresorhus / is-reachable這樣的庫。 后者將是我的首選。

干杯!

Answer 3

您應該執行@chith在.then .then()指出的相同驗證，因為在我的服務器測試請求時，我遇到了一個奇怪的問題，“響應”就好像它是成功的。

此外，在.then()使用response.status而不是response.error

Answer 4

你可以使用攔截器 ：

axios.interceptors.response.use(
    response => {
        return response
    },
    error => {
        if (!error.response) {
            console.log("Please check your internet connection.");
        }

        return Promise.reject(error)
    }
)