title: File size issue in Chrome for base64-encoded PDF data in OBJECT tag
body: <p>My problem is related to displaying base64-encoded PDF file data in Chrome browser. The PDF files are not static physical files rather they are streams converted to base64-encoded data. It is a single page application using Node.js backend. The pdf file is displayed in a modal popup box, instead of a new tab or window. The code responsible for displaying the base64-encoded PDF data is given below:</p>
  
  <pre><code>var objbuilder = '';
  objbuilder += ('&lt;object width="100%" height="100%" data="data:application/pdf;base64,');
  objbuilder += (r.response);
  objbuilder += ('" type="application/pdf" class="internal"&gt;');
  objbuilder += ('&lt;/object&gt;');
  var html = '';
  html += '&lt;div class="modal fade in" id="linkedDoc" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"&gt;';
  html += '&lt;div class="modal-dialog"&gt;';
  html += '&lt;div class="modal-content" style="height:800px;width:600px;"&gt;';
  html += '&lt;div class="modal-body" style="height: 100%;" id = "linkedBody"&gt;';
  html += '&lt;div style="height:25px;clear:both;display:block;"&gt;';
  html += '&lt;a class="controls previous" href="javascript:void(0);" data-dismiss="modal" aria-hidden="true"&gt;Close&lt;/a&gt;';
  html += '&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;';
  $('#linkedDoc').remove();
  $('body').append(html);
  $('#linkedBody').append(objbuilder);
  $('.modal').modal({
      keyboard: false,
      show: true
  });
  $('.modal-dialog').draggable({
      handle: ".modal-header"
  });
  $('.modal-content').resizable();
  $('#linkedBody').on('show.bs.modal', function () {
      $(this).find('.modal-body').css({
          'max-height': '100%',
          'max-width': '100%'
      });
  });
  </code></pre>
  
  <p>The approach works well for file with almost 1 MB file size but not more than that. Some of the files I want to display are 5 MBs and some are even 10 MBs. How can I fix this issue. <a href="https://stackoverflow.com/questions/291813/recommended-way-to-embed-pdf-in-html">This</a> and <a href="https://stackoverflow.com/questions/14690000/embed-a-pdf-in-html5">This</a> SO questions are relevant to the topic but not specific for my situation.</p>
  
  <p>I can't use HTML 'embed' and 'iframe' tags because they need a physical file as their 'src' attribute but I don't have a physical PDF file rather its in-memory data.</p>