title: How to get HTTP error detail and text from fetch and Promises?
body: <p>A lot of posts, questions and articles explain how to handle HTTP errors from fetch requests, but solutions only point <code>logging</code> or just use text of the answer, but i'd like to get response details (status + statusText) and response text (given by the server)</p>
  
  <p>I want to have a generic <code>fetch_api</code> that I could use in my different components then. For the valid response it's working, but for the error I can't manage to get details + text from server, because I need to return a <code>rejected Promise</code> but I can't make it working, here are my tries to get</p>
  
  <ul>
  <li>response.status</li>
  <li>response.statusText</li>
  <li>response.url</li>
  <li>response.text() // this is a Promise and I can't get it and also the details</li>
  </ul>
  
  
  
  <pre><code>static fetch_api(url, method = 'get') {
      return fetch(url, {method: method})
          .then(res =&gt; {
              if (res.ok) return res.json();
              throw res;
          })
          .then((result) =&gt; result
              , (error) =&gt; {
                  const err = ("[" + error.status + ":" + error.statusText + "] while fetching " +
                                 error.url + ", response is " + error.text()) // how to get server text
                  return Promise.reject(err) // ok but server text missing 
                  //Er [404:NOT FOUND] while ... is [object Promise] 
  
                  return Promise.reject().then(() =&gt; error.text()) // Not ok
  
                  return Promise.reject(error.status)     // OK but need all
  
                  return Promise.reject(error.statusText) // OK but need all
              }
          )
  }
  
  // USE
  fetchStatus() {
      App.fetch_get(host + "/statusERROR")
         .then(result =&gt; this.setState({isLoaded: true, modules: result}))
         .catch(error =&gt; this.setState({isLoaded: true, error: {message: error}}))
  }
  </code></pre>
  
  <p>Sources for basic handling, mots of them is just logging</p>
  
  <ul>
  <li><a href="https://stackoverflow.com/questions/49626431/react-native-fetch-http-request-throw-error">react native fetch http request throw error</a></li>
  <li><a href="https://stackoverflow.com/questions/51473585/fetch-image-in-react-from-node-js-request">Fetch image in React from Node.js request</a></li>
  <li><a href="https://github.com/github/fetch/issues/203" rel="nofollow noreferrer">https://github.com/github/fetch/issues/203</a></li>
  <li><a href="https://gist.github.com/odewahn/5a5eeb23279eed6a80d7798fdb47fe91" rel="nofollow noreferrer">https://gist.github.com/odewahn/5a5eeb23279eed6a80d7798fdb47fe91</a></li>
  <li><a href="https://www.tjvantoll.com/2015/09/13/fetch-and-errors/" rel="nofollow noreferrer">https://www.tjvantoll.com/2015/09/13/fetch-and-errors/</a> </li>
  <li><a href="https://gist.github.com/philipszdavido/fea2e353805294f374b6cb121ce43fa5" rel="nofollow noreferrer">https://gist.github.com/philipszdavido/fea2e353805294f374b6cb121ce43fa5</a></li>
  </ul>