Skip to content

Fetch hangs when trying to access HTTP streaming API #12912

Closed
@mythz

Description

@mythz

Description

Cannot use W3C's Fetch streaming API to access a long-running SSE event-stream which just hangs until the stream has ended.

Reproduction

var start = Date.now();
console.log("fetch() ...", Date.now() - start, "ms");
fetch("http://chat.servicestack.net/event-stream")
  .then(res => {
      console.log("then() ...", Date.now() - start, "ms");
      if (!res.ok)
        throw new Error(`${res.status} = ${res.statusText}`);

      var reader = res.body.getReader();
      return reader.read().then(function handleNext(result) {
          console.log("read() ...", Date.now() - start);
      });
  })
  .catch(error => {
      console.log("catch() ", error.message, Date.now() - start, "ms");
  });

In React Native this prints out:

fetch() ... 0 ms
then() ... 32205 ms
catch()  undefined is not an object (evaluating 'res.body.getReader') 32212 ms

i.e. where it doesn't complete until the server terminates the connection and when it does complete it saysres.body isn't an object. Whereas in Chrome it works as expected:

fetch() ... 0 ms
then() ... 28 ms
read() ... 28

Solution

It doesn't look like fetch has implemented streaming support which means we can't access long-running HTTP Streams in React Native.

Additional Information

  • React Native version: latest 0.42.0
  • Platform: iOS
  • Operating System: OSX Sierra

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions