Google Docs Viewer occasionally failing to load content in iframe

This is not fixing your problem per se, but since I had the same problem and I eventually managed to find an acceptable solution, I thought I’d share it.

var $docViewer = $(`<iframe src="https://stackoverflow.com/questions/35298724/${newValue}" height="100%" width="100%"></iframe>`);
//If using modern browser, use and embed object
if (window.chrome || typeof (window.mozInnerScreenX) != "undefined")
  $docViewer = $(`<object width="100%" height="100%" data="https://stackoverflow.com/questions/35298724/${newValue}" type="application/pdf">
                    <embed src="https://stackoverflow.com/questions/35298724/${newValue}" type="application/pdf">
                        <p>This browser does not support PDFs.Please download the PDF to view it: <a href="https://stackoverflow.com/questions/35298724/${newValue}">Download PDF</a>.</p>
                    </embed>
                </object>`);
//Add the new viewer
$docViewer.appendTo($("#invoicePreview"));

Basically, use an embed if modern browser, and the gviewer if not. The embed object behaves identically to the google doc viewer, it works in 100% of cases (no failed loads), but since it’s not supported for IE and/or low-end mobile devices, use the google doc viewer for that… Progressive Enhancements I guess.