Получить данные из объекта ReadableStream?

Как я могу получить информацию от объекта ReadableStream?

Я использую API-интерфейс Fetch, и я не вижу, чтобы это было ясно из документации.

Тело возвращается как ReadableStream, и я просто хотел бы получить доступ к свойству в этом потоке. В разделе "Ответ" в инструментах браузера dev я обнаружил, что эта информация организована в свойствах в виде объекта 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();
    })

Спасибо заранее.

Ответ 1

Чтобы получить доступ к данным из 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
  });

Надеюсь, это поможет прояснить ситуацию.

Ответ 2

Некоторые люди могут найти полезный пример async:

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

json() преобразует тело ответа из ReadableStream в объект json.

Операторы await должны быть завернуты в функцию async, однако вы можете запускать операторы await непосредственно в консоли Chrome (начиная с версии 62).

Ответ 3

res.json() возвращает обещание. Попробуйте...

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

Ответ 4

Немного опоздал на вечеринку, но имел некоторые проблемы с получением чего-то полезного из ReadableStream, созданного из пакетного запроса Odata $ с использованием Sharepoint Framework.

Были проблемы, аналогичные OP, но в моем случае решение состояло в том, чтобы использовать метод преобразования, отличный от .json(). В моем случае .text() работал как шарм. Однако, чтобы получить полезный JSON из текстового файла, нужно было немного поиграться.

Ответ 5

Если вы просто хотите получить ответ в виде текста и не хотите преобразовывать его в 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);
  });

Ответ 6

Я не люблю цепочки тогда. Второй тогда не имеет доступа к статусу. Как указано выше, response.json() возвращает обещание. Возвращает результат then "response.json()" в действиях, аналогичных секундам then. У этого есть дополнительный бонус того, чтобы быть в области ответа.

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

Ответ 7

Выборочные объекты ReadableStream должны использоваться, как описано в https://developer.mozilla.org/en-US/docs/Web/API/Streams_API/Using_readable_streams