CODEWITHSUNDEEP
javascriptphphtmlbase64
banibanc
banibanc

Reputation: 141

base64 pdf cached won't show

I have an object tag that displays a pdf from a base64 string like this :

<object id="pdfViewer" data="data:application/pdf;base64,BASE64STRING" wmode="transparent" type="application/pdf" title="document" width="100%" height="800" internalinstanceid="60" style="height: 401px;"></object>

On some computers, when the file loads for the first time, it's displayed like it should. Then it's "loaded from the cache" (in chrome network inspector) and the object doesn't render anything. base64 from cache

If I go back on the page in incognito mode, it works again (only the first time). Same if I clear the cache from the browser.

Does anyone have a hint on what may cause this ?

Thanks !

Upvotes: 1

Views: 1093

Answers (1)

Theo Orphanos
Theo Orphanos

Reputation: 1447

Well, my answer came in a little late as I also ran into the same problem just recently.

I wanted to display a pdf file from server.

Since the pdf containing folder was protected with htaccess, I did an ajax request which would return the file contents encoded as base64. Chrome would cache it and it would only render the first time, while any other time would just render blank... On Safari or Firefox it was working great but I had to fix it for Chrome too.

So, here is what I did:

This is the part of my ajax file that creates the Base64 encoded contents of the pdf and "echoes" it:

<?php

// ....some -irrelevant to the case- code here

$output_doc = /path/to/myDoc.pdf;
$file = file_get_contents($output_doc);
//echo base64_encode($file); //here caching was working and problem existed
echo base64_encode($file."?".time()); //here I eliminated caching by adding a "time" parameter

?>

And this is how I render the content of the pdf file in an "object" tag:

$.ajax({
    type:'post',
    url:'/ajax/file_get.ajax.php',
    data:'file=/path/to/myDoc.pdf',
    success:function(response){
        $('#pdf_object').attr('data','data:application/pdf;base64,'+response);
    }
});

And finally, this is the part of my html that displays the file:

<object type="application/pdf" id="pdf_object" style="width:100%; min-height:400px; height:100%;"></object>

Hope that helps you (and others)!

Upvotes: 1

Related Questions