Wie kann ich den Statuscode von einem http-Fehler in Axios erhalten?

Das mag dumm erscheinen, aber ich versuche, die Fehlerdaten abzurufen, wenn eine Anforderung in Axios fehlschlägt.

axios.get('foo.com')
    .then((response) => {})
    .catch((error) => {
        console.log(error) //Logs a string: Error: Request failed with status code 404
    })

Ist es möglich, anstelle der Zeichenfolge ein Objekt mit möglicherweise dem Statuscode und dem Inhalt abzurufen? Beispielsweise:

Object = {status: 404, reason: 'Not found', body: '404 Not found'}

Was Sie sehen, ist die Zeichenfolge, die von der toStringMethode des errorObjekts zurückgegeben wird. ( errorist keine Zeichenfolge.)

Wenn eine Antwort vom Server empfangen wurde, enthält das errorObjekt die responseEigenschaft:

axios.get('/foo')
  .catch(function (error) {
    if (error.response) {
      console.log(error.response.data);
      console.log(error.response.status);
      console.log(error.response.headers);
    }
  });

Wie @Nick sagte, hängen die Ergebnisse, die Sie sehen, wenn Sie console.logein JavaScript- ErrorObjekt verwenden, von der genauen Implementierung ab console.log, die variiert und (imo) das Überprüfen von Fehlern unglaublich ärgerlich macht.

Wenn Sie das vollständige ErrorObjekt und alle darin enthaltenen Informationen unter Umgehung der toString()Methode anzeigen möchten , können Sie einfach JSON.stringify verwenden :

axios.get('/foo')
  .catch(function (error) {
    console.log(JSON.stringify(error))
  });

Ich benutze diese Interceptors, um die Fehlerantwort zu erhalten.

const HttpClient = axios.create({
  baseURL: env.baseUrl,
});

HttpClient.interceptors.response.use((response) => {
  return response;
}, (error) => {
  return Promise.resolve({ error });
});

Mit TypeScript ist es einfach, mit dem richtigen Typ zu finden, was Sie wollen.

import { AxiosResponse, AxiosError } from 'axios'

axios.get('foo.com')
  .then(response: AxiosResponse => {
    // Handle response
  })
  .catch((reason: AxiosError) => {
    if (reason.response!.status === 400) {
      // Handle 400
    } else {
      // Handle else
    }
    console.log(reason.message)
  })

Mit dem Spread-Operator ( ...) können Sie ein neues Objekt wie folgt erzwingen:

axios.get('foo.com')
    .then((response) => {})
    .catch((error) => {
        console.log({...error}) 
})

Beachten Sie: Dies ist keine Fehlerinstanz.

Dies ist ein bekannter Fehler, versuchen Sie ihn zu verwenden "axios": "0.13.1"

https://github.com/mzabriskie/axios/issues/378

Ich hatte das gleiche Problem und habe es letztendlich benutzt "axios": "0.12.0". Es funktioniert gut für mich.

validateStatusIn der Anforderungskonfiguration gibt es eine neue Option . Sie können damit festlegen, dass keine Ausnahmen ausgelöst werden, wenn Status <100 oder Status> 300 (Standardverhalten). Beispiel:

const {status} = axios.get('foo.com', {validateStatus: () => true})

Sie können den Fehler in ein Objekt einfügen und das Objekt folgendermaßen protokollieren:

axios.get('foo.com')
    .then((response) => {})
    .catch((error) => {
        console.log({error}) // this will log an empty object with an error property
    });

Hoffe das hilft jemandem da draußen.

Um den vom Server zurückgegebenen http-Statuscode zu erhalten, können Sie validateStatus: status => trueaxios-Optionen hinzufügen :

axios({
    method: 'POST',
    url: 'http://localhost:3001/users/login',
    data: { username, password },
    validateStatus: () => true
}).then(res => {
    console.log(res.status);
});

Auf diese Weise löst jede http-Antwort das von axios zurückgegebene Versprechen.

https://github.com/axios/axios#handling-errors