提取：拒绝承诺并在状态不正常时捕获错误？

Question

这是我已经打算：

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中使用这个fetch polyfill与redux-promise-middleware。

Answer 1

感谢大家的帮助，拒绝承诺在.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; 
} 

Answer 2

Fetch承诺只在网络错误发生时用TypeError拒绝。由于4xx和5xx响应不是网络错误，因此没有什么可以捕捉的。你需要自己抛出一个错误才能使用Promise#catch。

A fetch Response方便地提供了一个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) 
});