title: How to download a ReadableStream on the browser that has been returned from fetch
body: <p>I am receiving a ReadableStream from a server, returned from my fetch call.</p>
  <p>A ReadableStream is returned but I don't know how to trigger a download from this stage. I can't use the url in an href because it requires an Authorization token.</p>
  <p>I don't want to install <code>fs</code> on the client so what options do I have?</p>
  <pre><code>  try {
      const res = await fetch(url, {
        method: 'GET',
        headers: {
          Authorization: `Bearer ${token}`,
          'Content-Type': 'application/octet-stream'
        }
      });
  
      const blob = await res.blob();
  
      const newBlob = new Blob([blob]);
      const newUrl = window.URL.createObjectURL(newBlob);
  
      const link = document.createElement('a');
      link.href = newUrl;
      link.setAttribute('download', 'filename');
      document.body.appendChild(link);
      link.click();
      link.parentNode.removeChild(link);
  
      window.URL.revokeObjectURL(newBlob);
    } catch (error) {
      console.log(error);
    }
  </code></pre>
  <p>Update 1</p>
  <p>I converted the file to a Blob, then passed it into a newly generated href. Successfully downloaded a file. The end result was the ReadStream contents as a .txt file.</p>
  <p>Meaning stuff like this</p>
  <pre><code>x:ÚêÒÓ%¶âÜTb∞\Üƒ
  </code></pre>