Nuxt Axios Module читает код состояния - PullRequest
Новая
       11

Nuxt Axios Module читает код состояния

0 голосов
/ 30 апреля 2018

Я вызываю API отдыха, который возвращает как минимум 2 кода статуса успеха. Нормальный 200 OK и 202 Принятый код состояния. Оба возвращают Контент в теле. Если я выполню свои звонки почтальоном, я получу что-то вроде

Код статуса: 202 Принято. С Body "Queued" или некоторыми другими значениями enter image description here enter image description here или

Код статуса: 200 ОК. С телом "ValueOfSomeToken" enter image description here Звонок с помощью axios в моем приложении nuxt: 

this.$axios.$get('/Controller/?id=1')
  .then((response)=>{
     if(response=='Queued'){
         //Do something
     }
     else if (response=='Expired'){
       //Do something
     }
     else{
       //Do something
     }
  })
  .catch((error)=>{
            console.log(error);
  });

.. работает, но я на самом деле хотел бы получить код состояния (потому что 202 имеет другие значения для ответов тела)

Понятия не имею, как читать коды состояния.

Я пытался использовать (ответ, код) => ... но код ничего не значит.

1 Ответ

0 голосов
/ 04 мая 2018

Вы можете извлечь status codes из объекта ответа в axios

если вы напечатаете объект ответа (как показано на рисунке ниже), вы сможете увидеть все объекты внутри объекта ответа. Одним из них является status object

enter image description here

response.status выдаст вам код состояния, отправленный с сервера 

axios.get("http://localhost:3000/testing").then((response)=>{
    console.log("response ",response);
    if(response.status == 200){
        //do something
    }
    else if(response.status == 202){
        //do something
    }
    else if(response.status == 301){
        //do something
    }
}).catch((err)=>{
    console.log("err11 ",err);
})

На стороне сервера вы можете явно отправить любой код состояния, используя метод res.status(), для получения более подробной информации см. эту документацию 

app.get('/testing',(req, res)=> {
  res.status(202).send({"res" : "hi"});
});

Обновление:

По умолчанию @nuxtjs/axios возвращает response.data в .then((response))

Событие $axios.onResponse будет иметь доступ к полному объекту ответа.

Вам необходимо настроить перехватчик для перехвата события $axios.onResponse и изменения объекта ответа

В каталоге плагинов создайте плагин, plugin/axios.js

Обновление раздела plugins plugins : ['~/plugins/axios'] в nuxt.config.js 

export default function ({ $axios, redirect }) {
    $axios.onResponse(res=>{
        console.log("onResponse ", res);
        res.data.status = res.status;        
        return res;
    })
}

В res object в этом перехватчике у вас будут все значения (как показано на моем первом скриншоте). Но это res object не возвращается как есть, только res.data возвращается в нашу программу.

Мы можем обновить содержимое внутри res.data, а затем вернуть res object, как показано в моей программе res.data.status = res.status;.

Теперь, когда axios вернет res.data, у нас будет доступ к res.data.status значению в response объекте в .then((response)) обещании

Вы можете получить доступ к статусу, используя response.status внутри this.$axios

this.$axios.$get("url").then((response) =>{
    console.log("status ",response.status);
}).catch((err) => {
    console.log("res err ",err);
});
...