fetch response.json（）とresponse.status

Question

これはbody.json()を使用してステータスコードを取得する唯一の方法ですか？

let status; 

return fetch(url) 
    .then((response => { 
     status = response.status; 
     return response.json() 
    }) 
    .then(response => { 
     return { 
      response: response, 
      status: status 
     } 
    }); 

それが応答フィールドでの約束を返すので、これは動作しません：

.then((response)=> {return {response: response.json(), status: response.status}}) 

Answer 1

あなたの状況は、第二thenには表示されません。あなたは単一のthenの2つのプロパティを取得することができます。

json()はあなたに新しいPromiseを返すので、その関数の結果のthenの中にオブジェクトを作成する必要があります。関数からPromiseを返すと、それが実行され、その実行結果（この場合はオブジェクト）が返されます。

fetch("https://jsonplaceholder.typicode.com/posts/1") 
 
.then(r => r.json().then(data => ({status: r.status, body: data}))) 
 
.then(obj => console.log(obj));

Answer 2

あなたはこれを試してみましたか？

return fetch(url) 
    .then((r)=> {return {response: r.json(), status: r.status}}) 

Answer 3

私は先週、まったく同じ問題に直面しました。 .jsonメソッドは、JSON自体ではなく、JSONに約束を返します。あなたが一度に応答し、JSONの両方にアクセスしたい場合は、このように、ネストされたクロージャを使用する必要があります：

fetch(...) 
    .then(response => { 
     response.json().then(json => { 
      // code that can access both here 
     }) 
    }) 

をjson約束に渡されたコールバックがfetch約束にコールバック内で作成されたので、 responseにもアクセスできます。

JSONとエラーのケースを処理し、すべてのフェッチでそれを再利用する関数を作成することができます。たとえば、次のようなものがあります。

function fetchHandler(response) { 
    if (response.ok) { 
     return response.json().then(json => { 
      // the status was ok and there is a json body 
      return Promise.resolve({json: json, response: response}); 
     }).catch(err => { 
      // the status was ok but there is no json body 
      return Promise.resolve({response: response}); 
     }); 

    } else { 
     return response.json().catch(err => { 
      // the status was not ok and there is no json body 
      throw new Error(response.statusText); 
     }).then(json => { 
      // the status was not ok but there is a json body 
      throw new Error(json.error.message); // example error message returned by a REST API 
     }); 
    } 
}