提取：如果状态不正常，则拒绝承诺并捕获错误？

Question 1

这是我要去的事情：

import 'whatwg-fetch';

function fetchVehicle(id) {
    return dispatch => {
        return dispatch({
            type: 'FETCH_VEHICLE',
            payload: fetch(`http://swapi.co/api/vehicles/${id}/`)
                .then(status)
                .then(res => res.json())            
                .catch(error => {
                    throw(error);
                })
            });
    };
}

function status(res) {
    if (!res.ok) {
        return Promise.reject()
    }
    return res;
}

编辑：诺言不会被拒绝，这就是我试图找出的。

我正在Redux和redux-promise-middleware中使用此访存 polyfill。

Question 2

发生网络错误时，提取承诺仅以TypeError拒绝。由于4xx和5xx响应不是网络错误，因此没有任何问题。您需要自己抛出一个错误才能使用Promise#catch。

一个获取响应方便地提供的ok ，它告诉你的请求是否成功。这样的事情应该可以解决问题：

fetch(url).then((response) => {
  if (response.ok) {
    return response.json();
  } else {
    throw new Error('Something went wrong');
  }
})
.then((responseJson) => {
  // Do something with the response
})
.catch((error) => {
  console.log(error)
});

Question 3

感谢大家的帮助，拒绝诺言.catch()解决了我的问题：

export function fetchVehicle(id) {
    return dispatch => {
        return dispatch({
            type: 'FETCH_VEHICLE',
            payload: fetch(`http://swapi.co/api/vehicles/${id}/`)
                .then(status)
                .then(res => res.json())    
                .catch(error => {
                    return Promise.reject()
                })
            });
    };
}


function status(res) {
    if (!res.ok) {
        throw new Error(res.statusText);
    }
    return res;
}

Question 4

对于我来说，fny的答案确实可以解决所有问题。由于fetch不会引发错误，因此我们需要自己引发/处理错误。用异步/等待发布我的解决方案。我认为这更具前瞻性和可读性

解决方案1：不引发错误，请自行处理错误

  async _fetch(request) {
    const fetchResult = await fetch(request); //Making the req
    const result = await fetchResult.json(); // parsing the response

    if (fetchResult.ok) {
      return result; // return success object
    }


    const responseError = {
      type: 'Error',
      message: result.message || 'Something went wrong',
      data: result.data || '',
      code: result.code || '',
    };

    const error = new Error();
    error.info = responseError;

    return (error);
  }

在这里，如果遇到错误，我们将构建一个错误对象，普通的JS对象并返回它，缺点是我们需要在外部进行处理。如何使用：

  const userSaved = await apiCall(data); // calling fetch
  if (userSaved instanceof Error) {
    debug.log('Failed saving user', userSaved); // handle error

    return;
  }
  debug.log('Success saving user', userSaved); // handle success

解决方案2：使用try / catch引发错误

async _fetch(request) {
    const fetchResult = await fetch(request);
    const result = await fetchResult.json();

    if (fetchResult.ok) {
      return result;
    }

    const responseError = {
      type: 'Error',
      message: result.message || 'Something went wrong',
      data: result.data || '',
      code: result.code || '',
    };

    let error = new Error();
    error = { ...error, ...responseError };
    throw (error);
  }

在这里，我们抛出并创建了我们创建的错误，因为Error ctor仅批准字符串，Im创建了普通的Error js对象，其用法为：

  try {
    const userSaved = await apiCall(data); // calling fetch
    debug.log('Success saving user', userSaved); // handle success
  } catch (e) {
    debug.log('Failed saving user', userSaved); // handle error
  }

解决方案3：使用客户错误

  async _fetch(request) {
    const fetchResult = await fetch(request);
    const result = await fetchResult.json();

    if (fetchResult.ok) {
      return result;
    }

    throw new ClassError(result.message, result.data, result.code);
  }

和：

class ClassError extends Error {

  constructor(message = 'Something went wrong', data = '', code = '') {
    super();
    this.message = message;
    this.data = data;
    this.code = code;
  }

}

希望能有所帮助。

Question 5

我只是检查了响应对象的状态：

$promise.then( function successCallback(response) {  
  console.log(response);
  if (response.status === 200) { ... }
});