爲什麼取得這樣的迴應？

Question

當我在控制檯中檢查它時，我從提取中獲得了這種響應，如圖所示。但是，當我從devtool Network檢查時，它顯示正確的錯誤響應。有關如何處理這個問題的任何想法？

export function loginRequest(data){ 
    return (dispatch, getState) => { 
    let tmp = Object.assign({},data)  
    var request = new Request('https://aaa.com/json', { 
     method: 'POST', 
     mode: 'cors', 
     headers: new Headers({ 
     'Content-Type': 'text/plain' 
     }) 
    }); 
    fetch(request).then((res)=>{   
     alert(JSON.stringify(res)) 
     dispatch({ 
     type: types.LOGIN, 
     data: res 
     }) 
    }).catch(err =>{ 

      alert(JSON.stringify(err)) 
      alert(err.errMsg) 
      dispatch({ 
      type: types.LOGIN, 
      data: data 
     }) 
     console.log(JSON.stringify(err)) 
    }) 

    } 
} 

Answer 1

您需要解析到JSON的反應，看看符合你在網絡選項卡中查看響應。

fetch('//offline-news-api.herokuapp.com/stories') 
// First you can deal with the response, checking status code, headers, etc. 
.then(function(response) { 
    if (response.status >= 400) { 
     throw new Error("Bad response from server"); 
    } 

    // This is the line you are missing 
    return response.json(); 
}) 
// Now you will see the proper JSON response that should match 
// what you see in the network tab. 
.then(function(stories) { 
    console.log(stories); 
}); 

使用fetch，您可以看到原始的反應，這是你的截圖看來什麼是，然後你可以將其解析到JSON查看響應的身體，你期待。這允許更多的微調的錯誤處理，響應控制等

Answer 2

您還可以使用axios，你不必解析您的response，不具備手動reject如果有400錯誤，它會去改爲catch。