title: Saving images in mongodb as blob, React
body: <p>I am using the dropzone-react component to upload pictures. After uploading, it gives me the <code>blob:http://test</code> address and if I open it I can see the picture i uploaded. 
  What challenges me now is that I want to save this image as a blob-type into MongoDB.</p>
  
  <p>This is my current code which is called after I chose a picture to upload. The files[0].preview shows the correct URL. Also <code>console.log(blob)</code> shows the blob in the console (but I can't find a data section, maybe that is the problem?</p>
  
  <pre><code>onFileDrop(files) {
      var xhr = new XMLHttpRequest();
      console.log(files[0].preview);
      xhr.open('GET', files[0].preview, true);
      xhr.responseType = 'blob';
      xhr.onload = function(e) {
          if (this.status == 200) {
              var blob = xhr.response;
              console.log(blob);
              Database.update({_id : _stateId}, { $push : {picture : blob}});
              }
          };
      xhr.send();
  </code></pre>
  
  <p>But after I update the database the picture element is just empty in the MongoDB. I tried saving xhr.response.type and this works, but I somehow have to access the data to store it inside MongoDB and retrieve it as a picture on another line in my code.</p>
  
  <p>Am I missing some crucial step or is there even an easier approach to saving images in mongoDB by using react? </p>
  
  <p>I am using the meteor framework, if that's an important information.</p>