title: Properly Create and Serve PDF Blob via HTML5 File and URL APIs
body: <p>Ok, Let's say I have document data stored somewhere, let's arbitrarily take <a href="http://www.grida.no/climate/ipcc_tar/wg1/pdf/tar-01.pdf">this pdf</a>.</p>
  
  <p>Issue #1.  What I want to do is make an AJAX call to this URL (because I need to pass some authentication headers and it is cross domain).  Then take the returned data, create a <a href="https://developer.mozilla.org/en-US/docs/DOM/window.URL.createObjectURL">blob url</a> for it, append an iFrame to the DOM, and direct the <code>src</code> to the blob url.  </p>
  
  <p>Currently my code looks like this:</p>
  
  <pre><code>$.ajax({
    url:'http://www.grida.no/climate/ipcc_tar/wg1/pdf/tar-01.pdf'
  }).done(function(data){
     var file = new Blob([data], {type:'application/pdf'}),
         url = URL.createObjectURL(file),
         _iFrame = document.createElement('iframe');
        _iFrame.setAttribute('src', url);
        _iFrame.setAttribute('style', 'visibility:hidden;');
        $('#someDiv').append(_iFrame);
  });
  </code></pre>
  
  <p>Unfortunately, I am getting a 'Failed to Render PDF' in the iFrame.</p>
  
  <p>Issue #2.  I'd like this to result in a file download prompt.  Not sure how to guarantee this given that PDF's will naturally just display in the iFrame.</p>