如何在React Native中顯示服務器對HTTP錯誤的響應

我正在使用React Native應用程序。我們最近更改了一個API調用，它可以響應500個錯誤消息，詳細說明問題，以便將其呈現給用戶。該API響應的樣子：如何在React Native中顯示服務器對HTTP錯誤的響應

{ 
    "error": ["Renter contact info for User 1 missing"] 
}

在客戶端，我們使用標準的fetch()方法以異步方式使我們的請求，並以拉Response對象瞭解決的前景。當我登錄一個電話後的反應應該觸發500，對象是這樣的：

{type: "default", status: 500, ok: false, statusText: undefined, headers: Headers…}

這是我們的內部request()方法，我們使用的所有API調用：

export function request(endpoint:string, parameters:Object, method:string = HTTP.get, timeout:number = 3000):Promise{ 

    return new Promise(async (resolve, reject) => { 
    const payload = { 
     method, 
     headers: { 
     'Accept': CONTENT_TYPE, 
     'Content-Type': CONTENT_TYPE, 
     'Authorization': `Basic ${base64.encode(Config.API_TOKEN)}`, 
     'Auth-Token': await Agents.authToken, 
     }, 
     body: JSON.stringify(parameters), 
    } 

    fetch(apiUrl(endpoint), payload) 
     .then(response => { 
     if(!response.ok) { 
      // ****************** 
      // this is where the 500 error state is caught, but my response object doesn't contain the message sent from the server. 
      reject(response) 
      // ****************** 
     } 

     return response 
     }) 
     .then(resolve) 
     .catch(reject) 
    }) 
}

我怎麼能保證響應對象包含來自服務器的錯誤消息，以便我可以正確地將其顯示給我的用戶？

來源

2017-04-20 djibouti33

React Native不受響應中缺少'Access-Control-Allow-Origin'標頭的影響，對吧？如果是這樣，我認爲這將是您無法訪問任何響應屬性的原因。請參閱http://stackoverflow.com/a/43361959/441757 – sideshowbarker

fetch(apiUrl(endpoint), payload) 
     .then(response => { 
     if(!response.ok) { 
      response.json().then(function(data) { 
      console.log(data);// your error response 
      },function(error) { 
      //json error 
      }); 
      reject(response) 
      // ****************** 
     } 

     return response 
     })

響應是一個ReadableStream對象。您需要使用.json（）來解析

來源

2017-04-20 05:43:28 TonyY

如何在React Native中顯示服務器對HTTP錯誤的響應

回答

相關問題