title: img src attribute return as binary data from $.post request
body: <p>I'm trying to render an image in an html page by making a post request to a php script, which opens the image in a binary mode and then returns the image with the correct content headers and renders it in the img tag. I see the binary data in the console but I'm not sure how to use this to render the image in the html page. </p>
  
  <p>The img src attribute is referencing this url: http://[IP]:[PORT]/img/123. When the request arrives at the server the url is rewritten to point to tracker.php. Within tracker.php a get request is made, which on success, returns an image url and makes another post request with this url as the data. Within the same tracker.php page a php script opens the file referenced by the url in a binary mode and outputs it with the correct headers. </p>
  
  <p>How do I get this data back to the html page img tag and render it correctly? Is this even possible? </p>
  
  <p>Thanks, J</p>
  
  <pre><code>&lt;?php 
  error_reporting(-1);
  #phpinfo();
  #var_dump($_REQUEST);
  if(isset($_POST['val'])) {
  
    // open the file in a binary mode
    $name = $_POST['val'];
    $fp = fopen($name, 'rb');
  
    // send the right headers
    header("Content-Type: image/png");
    header("Content-Length: " . filesize($name));
  
    // dump the picture and stop the script
    fpassthru($fp);
    exit;
  }
  ?&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;script type='text/javascript' src='/steal/steal.js'&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="/plugins/jquery/json2.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  steal('jquery/dom/fixture').then(function(){
  
  $.fixture("GET /event/{code}", function(original, settings, headers){
      return [200, "success", { "img_url":"http://path/to/my/img.png" }, {} ]
  })
  
  var strObj = &lt;?php echo json_encode($_REQUEST); ?&gt;;
  var str = strObj.q;
  var eventCode = str.split('/')[1];
  
  $.ajax({
    url: "/event/"+eventCode,
    success: function(data) {
       var imgUrl = data.img_url;
       $.post('/tracker.php', 'val='+imgUrl, function (response) {
          return response; // push img data from php back to html page img tag.
       });
     }
  });
  
  });
  &lt;/script&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>