Как получить читаемый ответ об ошибке из JavaScript Fetch API?

Я работаю над Reactjs redux на front-end и Rails api в качестве back-end.

Итак, теперь я вызываю API с помощью метода Fetch API, но проблема в том, что я не могу получить читаемое сообщение об ошибке, подобное тому, что я получил на вкладках сети

это моя функция

export function create_user(user,userInfoParams={}) {

    return function (dispatch) {
        dispatch(update_user(user));

        return fetch(deafaultUrl + '/v1/users/',
            {
                headers: {
                    'Accept': 'application/json',
                    'Content-Type': 'application/json'
                },
                method: "POST",
                body: JSON.stringify(userInfoParams)
            })
            .then(function(response) {
                console.log(response);
                console.log(response.body);
                console.log(response.message);
                console.log(response.errors);
                console.log(response.json());
                dispatch(update_errors(response));

                if (response.status >= 400) {
                    throw new Error("Bad response from server");
                }

            })
            .then(function(json){
                console.log("succeed json re");
                // We can dispatch many times!
                // Here, we update the app state with the results of the API call.

                dispatch(update_user(json));

            });


    }
}

Но когда появились ошибки, я не могу понять, как получить читаемое ответное сообщение, которое я получал, когда проверял вкладки сети моего браузера

Так вот, что я получил от вкладок сети, когда получил ошибки.

 введите описание изображения здесь

Моя консоль

 введите описание изображения здесь

Это мой код рельсов

def create
    user = User.new(user_params)
    if user.save
      #UserMailer.account_activation(user).deliver_now
      render json: user, status: 201
    else
      render json: { errors: user.errors }, status: 422
    end
  end

Но я не могу узнать, как я могу получить это в моей функции

Спасибо!

6 голосов | спросил Varis Darasirikul 3 42016vEurope/Moscow11bEurope/MoscowThu, 03 Nov 2016 20:54:18 +0300 2016, 20:54:18

4 ответа


0

хорошо, я думаю, что наконец-то взломал это.

текст скрыт внутри обещания внутри объекта ответа, поэтому его нужно обрабатывать как обещание, чтобы увидеть его.

fetch(bla)
    .then(res => {
      if(!res.ok) {
        res.text().then(text => throw Error(text))
       }
      else {
       return res.json();
     }    
    })
    .catch(err => {
       console.log('caught it!',err);
    }
ответил Martins Untals 15 J0000006Europe/Moscow 2017, 23:14:18
0

Сначала вам нужно вызвать метод json для вашего ответа.

Пример:

fetch(`${API_URL}`, {
        method: 'post',
        headers: {
           'Accept': 'application/json',
           'Content-Type': 'application/json'
        },
        body: JSON.stringify(userInfoParams)
    })
    .then((response) => response.json())
    .then((response) => console.log(response)) 
    .catch((err) => {
        console.log("error", err) 
    });

Дайте мне знать журнал консоли, если он у вас не работает.

ответил Dhyey 4 52016vEurope/Moscow11bEurope/MoscowFri, 04 Nov 2016 19:58:52 +0300 2016, 19:58:52
0

Аналогично вашему ответу, но с более подробным объяснением ... Сначала я проверяю, хорошо ли ответ, а затем генерирую ошибку из response.text() только для случаев, когда мы получили успешный ответ. Таким образом, сетевые ошибки (которые не являются ok) будут по-прежнему генерировать свою собственную ошибку без преобразования в текст. Затем эти ошибки обнаруживаются в последующем catch.

Вот мое решение: я извлек базовую функцию выборки в функцию-обертку:

const fetchJSON = (...args) => {
  return fetch(...args)
    .then(res => {
      if(res.ok) {
        return res.json()
      }
      return res.text().then(text => {throw new Error(text)})
    })
}

Затем, когда я его использую, я определяю, как обрабатывать мой ответ и ошибки по мере необходимости:

fetchJSON(url, options)
  .then((json) => {
    // do things with the response, like setting state:
    this.setState({ something: json })
  })
  .catch(error => {
    // do things with the error, like logging them:
    console.error(error)
  })
ответил Sia 7 MarpmWed, 07 Mar 2018 22:46:38 +03002018-03-07T22:46:38+03:0010 2018, 22:46:38
0

Возвращаемых вами переменных нет в response.body или response.message

Вам необходимо проверить наличие атрибута ошибок в объекте ответа.

if(response.errors) {
    console.error(response.errors)
}

Проверьте здесь https://developer.mozilla.org /EN-US /Docs /Web /API /Fetch_API /Using_Fetch

На самом деле вы должны возвращать код ответа об ошибке с сервера и использовать функцию .catch() API выборки

ответил ryan0319 3 42016vEurope/Moscow11bEurope/MoscowThu, 03 Nov 2016 21:01:55 +0300 2016, 21:01:55

Похожие вопросы

Популярные теги

security × 330linux × 316macos × 2827 × 268performance × 244command-line × 241sql-server × 235joomla-3.x × 222java × 189c++ × 186windows × 180cisco × 168bash × 158c# × 142gmail × 139arduino-uno × 139javascript × 134ssh × 133seo × 132mysql × 132