I have a page built with Flask that displays four images saved locally from another API I have written. From the webpage you can send commands to the API, which generates new images that overwrites and replaces the previous images at the same path. On some computers and browser, this works perfectly and on others the new images does not load to to caching. Since the whole point of the page is that it's dynamically changing all the time, it would not be an issue to disable caching all together, but I can't get it to work. I've tried putting the following code at the top of the HTML file but it still doesn't work, even when accessing it on a new browser and computer that never have visited the site.
{% extends 'base.html' %}
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">
<head>
...
Since the API changes the images locally and I don't have them as a response, I can't add headers to the images and neither can I add a version/date to the url since I am using Flask's built in url_for and send_from_directory to get the images.
I found that just adding SEND_FILE_MAX_AGE_DEFAULT = 0 to my app config fixed everything. Something to do with Flask saving static-files on its own and not updating it (Disabling caching in Flask).
Related
My application presents image files to the user (for photographic competition judging). It may present several thousand quite large files during a single session.
To present each image, I obtain a URL via a webservice using AJAX and then cause it to be displayed with
$("#imgImage").prop('src', resp.URL);
I am concerned about the storage usage within the user's browser. Will each image be added to the cache and if so, how can I prevent it?
I have the meta directives
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Expires" content="-1" />
but as the page itself is not reloaded each time, I'm not sure if they are effective.
You need to have the server send those headers with the HTTP response providing the images. In your page, they only apply to your page, not the images.
Beware that if your page ever shows the same image again (can the user go back? I'd want to be able to), the client will have to re-download it. If it's large, or they're on a metered connection, that may not be ideal.
I have a web application published on IIS. All of my JS files are called from my static html file called "Index.html". In that html file, I call each JS file with the <script> tag, and in order to manage our versions and perform updates without user's history and cache deleting, I've added the ?v={version} at the end of each JS file's URL as the following:
<script src="./app.js?v=20161226.1" />
After multiple version updates, I've noticed that the users still need to refresh the page in order to get the latest Index.html file. After searching the Developer Tools of chrome, and looking in the Network section in the Developer Tools, I've managed to notice that the Index.html file is loaded from the cache (shown the "(from cache)" sign in the Network).
After searching the web for any solution for uncaching .html files (Because there is no ?v={version} for my .html file), I've found that adding:
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="0" />
<meta http-equiv="pragma" content="no-cache" />
isn't solving the issue and the my Index.html file is still loaded from the cache.
I'm updaing my web application each two weeks and I can't afford myself letting the users deleting the cache and history each version update because the new and latest .html file is loaded because it is cached.
The only thing that helps is refreshing (F5) and then the Index.html file is reloaded (Not loaded from cache and the latest version of that Index.html file is shown). But if someone types the url and enters it in the URL-bar, the Index.html is still loaded from the cache.
Is there anything I've done wrong and should add anything else?
Is there anything to do to solve this issue at all?
Thanks!
Putting a query string on the end of a URL is a (good) hack to allow you to set the HTTP cache control headers to cache for a long time for infrequently changed resources and still force the new version to load on those occasions that you do change it.
If you are frequently updating your HTML, then just set the cache control headers to tell the browser to check for updates more frequently. Take advantage of Etags or If-Modified-Since instead of depending on an Expires header set far in the future.
NB: You have to use real HTTP headers. <meta http-equiv> is a bad joke.
How do you tell the Chrome Browser to not use the cached version of your site when it is redirected from a different location?
We have site www.example.com which has the normal cache busting techniques meta tags and adding ?a=b in your file and http calls however.
<meta http-equiv="cache-control" content="max-age=0"/>
<meta http-equiv="cache-control" content="no-cache"/>
<meta http-equiv="expires" content="0"/>
<script src="src/app.js?v=3.21.54"></script>
You update your code and all the customers get the new not the old, this works great!
Then SharePoint happened...
Your company got SharePoint which has a link to your site www.example.com but you found something odd happening Chrome uses cache when it is being redirected. Now with your bustfu failing what does one do?
I am considering generating .html files for my entire web site as I want my site to be as fast as possible. The files would be generated with dynamic content via a backend service as data updates occur.
How do I ensure users always see the latest content? Say I publish a change to my home page, index.html. How do I prevent these files from always coming from the user's cache and ensure new content, if available, is always retrieved and displayed?
Remember, I am using pure HTML.
If there is absolutely no way, I would not be adverse to using .php files containing HTTP cache-related header() calls prior to the content; e.g.:
<?php header(...) ?>
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
etc.
<META HTTP-EQUIV="PRAGMA" CONTENT="NO-CACHE">
<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
I have a JSF 1.1 web application, where I use ssl for lets say all pages. So when I try to download file with Internet Explorer 8, the classic security exception is raised, that I cannot download the file.
so I added to all responses with a Listener the headers suggested here: IE cannot download foo.jsf. IE was not able to open this internet site. The requested site is either unavailable or cannot be found
But it doesn't solved the problem. Then I realized that the generated html pages also contains elements:
meta content="no-cache" http-equiv="Pragma"
meta content="no-cache" http-equiv="Cache-Control"
meta content="no-store" http-equiv="Cache-Control"
So this could be the problem? How to change these for lets say all or selecte pages?
(I'm quite new in jsf)
thx
Those headers needs to be set on file download responses, not on JSF responses. A PhaseListener runs on JSF responses only (and is basically a clumsy approach for this purpose, a Filter would be better).
How and where exactly to set the headers depends on how you're serving the file download, which is not clear from the question.