title: PHP Can't Read AJAX Posted BLOB FormData File
body: <p><strong>DESCRIPTION &amp; CODE:</strong><br /><br />
  1) I have <strong>Image Files</strong> like this in my website (created by dynamic jQuery upload):</p>
  
  <pre><code>&lt;img src="blob:http%3A//www.example.net/6cf3e4f6-9666-41c8-a588-73f2e5057ee0"&gt;
  </code></pre>
  
  <p>2) After some action (e.g. button click) I want to save all these BLOB images on the server. I use <strong>jQuery</strong> code:</p>
  
  <pre><code>$('button').on('click', function() {
      $('#editor-label-working-area .object_container .image_container img').each(function() {
          var blob = null;
          var image = $(this);
          var file = $(image).attr('src');
          var oReq = new XMLHttpRequest();
  
          oReq.open('GET', file, true);
          oReq.responseType = 'blob';
  
          oReq.onload = function() {
              blob = new Blob([oReq.response], {
                  type: 'image/jpg'
              });
          };
  
          oReq.send();
  
          //(Problem No. 1) This timeOut is used just for test. I need to wait untill XMLHttpRequest is finished.
          setTimeout(function() {
              var formData = new FormData();
              formData.append('file', blob);
  
              $.ajax({
                  type: 'POST',
                  url: 'upload_image.php',
                  data: formData,
                  processData: false,
                  contentType: false,
                  success: function(data) {
                      console.log(data);
                  },
                  error: function(response) {
                      console.log(response);
                  }
              });
          }, 2000);
      });
  });
  </code></pre>
  
  <p>3) On AJAX request I want use my <strong>PHP</strong> code to get the posted File and save it on the server:</p>
  
  <pre><code>&lt;?php
      define('UPLOAD_DIR', 'labels/');
  
      /*(Problem No. 2) Here I get empty array from $_POST method*/
      $img = $_POST['file'];
  
      $img = str_replace('data:image/png;base64,', '', $img);
      $img = str_replace(' ', '+', $img);
  
      $data = base64_decode($img);
      $file = UPLOAD_DIR . uniqid() . '.jpg';
  
      $success = file_put_contents($file, $data);
  
      print $success ? $file : 'Unable to save the file.';
  ?&gt;
  </code></pre>
  
  <p><br /><br /><strong>PROBLEMS</strong><br /><br />
  1. Optional problem: In my jQuery code I have to use JS timeout method to wait until XMLHttpRequest created a blob file. This I need to understand how to use some kind of a waiting method that is working some other way than on a random waiting seconds</p>
  
  <p>2) <strong>The main and most important problem</strong>: why my PHP code receives empty array in $_POST method? If I do</p>
  
  <pre><code>echo json_encode($_POST['file']);
  </code></pre>
  
  <p>.., then AJAX .success function prints in my browser's console an empty array:</p>
  
  <pre><code>[]
  </code></pre>