ReadableStreamオブジェクトからデータを取得しますか？

ReadableStreamオブジェクトから情報を取得するにはどうすればよいですか？

私はFetch APIを使用していますが、ドキュメントからこれが明確であるとは思いません。

本文はとして返されReadableStreamます。このストリーム内のプロパティにアクセスしたいだけです。ブラウザー開発ツールの[応答]で、この情報がJavaScriptオブジェクトの形式でプロパティに整理されているように見えます。

fetch('http://192.168.5.6:2000/api/car', obj)
    .then((res) => {
        if(res.status == 200) {
            console.log("Success :" + res.statusText);   //works just fine
        }
        else if(res.status == 400) {
            console.log(JSON.stringify(res.body.json());  //res.body is undefined.
        }

        return res.json();
    })

からデータにアクセスするにReadableStreamは、いずれかの変換メソッドを呼び出す必要があります（ドキュメントはこちらから入手できます）。

例として：

fetch('https://jsonplaceholder.typicode.com/posts/1')
  .then(function(response) {
    // The response is a Response instance.
    // You parse the data into a useable format using `.json()`
    return response.json();
  }).then(function(data) {
    // `data` is the parsed version of the JSON returned from the above endpoint.
    console.log(data);  // { "userId": 1, "id": 1, "title": "...", "body": "..." }
  });

編集：データの戻り値の型がJSONでない場合、またはJSONが不要な場合は、text()

例として：

fetch('https://jsonplaceholder.typicode.com/posts/1')
  .then(function(response) {
    return response.text();
  }).then(function(data) {
    console.log(data); // this will be a string
  });

これが物事を明確にするのに役立つことを願っています。

一部の人々は、async例が役に立つと思うかもしれません：

var response = await fetch("https://httpbin.org/ip");
var body = await response.json(); // .json() is asynchronous and therefore must be awaited

json()応答の本文をa ReadableStreamからjsonオブジェクトに変換します。

awaitステートメントは、に包まれなければなりませんasyncが、あなたが実行することができ、機能await（バージョン62のような）クロームのコンソールに直接文を。

res.json()約束を返します。試してみてください...

res.json().then(body => console.log(body));

パーティーに少し遅れたが、何かから有用なものを得ることにいくつかの問題があった ReadableStream、Sharepoint Frameworkを使用してOdata $ batchリクエストから生成された。

OPと同様の問題がありましたが、私の場合の解決策はとは異なる変換方法を使用すること.json()でした。私の場合.text()、魅力のように働きました。ただし、テキストファイルからいくつかの便利なJSONを取得するには、いじくり回す必要がありました。

あなただけのテキストとして応答をしたいとJSONに変換したくない、使用している場合https://developer.mozilla.org/en-US/docs/Web/API/Body/textをして、thenそれが実際に取得するには約束の結果：

fetch('city-market.md')
  .then(function(response) {
    response.text().then((s) => console.log(s));
  });

または

fetch('city-market.md')
  .then(function(response) {
    return response.text();
  })
  .then(function(myText) {
    console.log(myText);
  });

私はその時の連鎖が嫌いです。次に、2番目はステータスにアクセスできません。前述のように、「response.json（）」はプロミスを返します。「response.json（）」のthen結果を、2番目のthenと同様の動作で返します。応答の範囲内にあるという追加のボーナスがあります。

return fetch(url, params).then(response => {
    return response.json().then(body => {
        if (response.status === 200) {
            return body
        } else {
            throw body
        }
    })
})

ストリームを一度しか読み取ることができないことに注意してください。そのため、場合によっては、繰り返し読み取るために応答を複製する必要があるかもしれません。

fetch('example.json')
  .then(res=>res.clone().json())
  .then( json => console.log(json))

fetch('url_that_returns_text')
  .then(res=>res.clone().text())
  .then( text => console.log(text))