Object tag cannot display latest version of PDF

Question

I'm hosting a website that has several PDF files currently in object tags that are updated weekly. The names of these PDF files remain the same, but the data has changed.

Currently I am using:

<object id="men" data="seasons/S2223/Men2023.pdf?" type="application/pdf" width="100%" height="750px">
<p>The file could not be read in the browser
      <a href="seasons/S2223/Men2023.pdf?"> Click here to download</a>
</p>
</object>

When I update the PDF, I expect

data="seasons/S2223/Men2023.pdf?"

Reading the latest PDF, but it remains the same as before.

I added it? At the end of the filename, it should check for the latest version, but it doesn't seem to work.

When I clear the browser's cache it updates, but of course this doesn't work for the user.

Thanks for all the help.

Answer 1

In this context, a cache refers to a place where the browser has loaded data from a URL in the past and still has a local copy of it. To speed things up and save bandwidth, it uses a local copy instead of requesting a new copy from the server.

If you want the browser to get a new copy, then you need to do something to make it think the copy in the cache is bad.

Cache clearing query string

You are trying to use this method, but it doesn't really suit your needs and your implementation is broken.

This technique is designed for resources that change infrequently and are unpredictable, such as a website's stylesheet. (Since your resources will change every week, this is not a good option for you.)

How it works is that it changes the URL of the resource whenever it changes. This means that the URL does not match the data cached by the browser. Since the browser does not know the new URL, it must request it again.

Since you have hardcoded the query to n=1, it will never change , which would destroy the object.

A common method is to set the query value to the timestamp or checksum of the file. (This is typically done using the website's build tools as part of the deployment process.)

Cache Control Header

HTTP provides a mechanism to tell the browser when it should obtain a new copy. There are various headers and I encourage you to read this Caching Tutorial for Web Authors and Webmasters: it covers the topic very well.

Since your document will expire every week, I think your best approach is to set the Expires header on the HTTP resource of the PDF's URL.

You can programmatically set this to (for example) one hour after the time a new version is expected to be uploaded.

How you do this depends on the HTTP server and/or server-side programming capabilities of the host where PDF is deployed.