title: How to read or convert an image blob url into an image?
body: <p>I have an image that is stored in local storage. On load the image is displayed.</p>
  
  <pre><code>componentDidMount() {
   const reader = new FileReader();
   reader.onload = e =&gt; {
    this.setState({ blob: e.target.result });
   };
   reader.readAsDataURL(this.props.file);
  }
  render() {
   return (
    &lt;div&gt;
     &lt;img src={this.state.blob} /&gt;
    &lt;/div&gt;
   )
  }
  </code></pre>
  
  <p>The file object looks like this:</p>
  
  <pre><code>lastModified:1535424554987
  name:"test.jpeg"
  preview:"blob:http://localhost:8080/b52098ca-087f83c778f0"
  size:41698
  type:"image/jpeg"
  webkitRelativePath:""
  </code></pre>
  
  <p>When I refresh the page and try to load the preview again, it doesn't display the image, and the file object looks different:</p>
  
  <pre><code>{preview: "blob:http://localhost:8080/b52098ca-087f83c778f0"}
  </code></pre>
  
  <p>Is it possible to read the image from this url? Or is it impossible to render the image without the full file object?</p>