title: Display image fetched from JSON responce in REACT
body: <p>In my application i need to show multiple images that are loaded from the server on a client side. </p>
  
  <p>This is the server response generating code(ASP.NET Core):</p>
  
  <pre><code>    //Create list of thumbnails
      List&lt;Object&gt; thumbnails = new List&lt;Object&gt;();
  
      foreach (ClosingDocument DItem in PackageConent.Documents)
      {
          DItem.GetPDFDocument();
  
          Bitmap thumbnail = DItem.GetThumbnailPage(1);
  
          thumbnails.Add(thumbnail);
      }
      JArray JO = JArray.FromObject(thumbnails);
  
      response.Add(new JProperty("PdfDocuments", JO));
  </code></pre>
  
  <p>Then on a client side i do
  console.log(data.Package.PdfDocuments<a href="https://i.stack.imgur.com/Rmlbh.png" rel="nofollow noreferrer">1</a>);</p>
  
  <p>and get the following:
  <a href="https://i.stack.imgur.com/Rmlbh.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Rmlbh.png" alt="enter image description here"></a></p>
  
  <p>But how do i convert it into something that i can put into the <code>&lt;img src="???"&gt;</code></p>
  
  <p>if i do the following:</p>
  
  <pre><code>var dataUrl = window.URL.createObjectURL(data.Package.PdfDocuments[1]);
  </code></pre>
  
  <blockquote>
    <p>TypeError: Failed to execute 'createObjectURL' on 'URL': No function
    was found that matched the signature provided.</p>
  </blockquote>
  
  <p>I edited the server code to return Base64 encoded image.</p>
  
  <p>now when i do </p>
  
  <pre><code>var blob = atob(data.Package.PdfDocuments[1]);
  console.log(blob);
  </code></pre>
  
  <p>i get:</p>
  
  <p><a href="https://i.stack.imgur.com/6zyeo.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/6zyeo.png" alt="enter image description here"></a></p>
  
  <p>But when i try to convert in to URL like this:</p>
  
  <pre><code>var data = window.URL.createObjectURL(blob);
  </code></pre>
  
  <p>i still get:</p>
  
  <blockquote>
    <p>TypeError: Failed to execute 'createObjectURL' on 'URL': No function was found that matched the signature provided.</p>
  </blockquote>
  
  <p>Thanks!</p>