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">
Related
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).
I need to make my application (SPA) to not cache index.html across page navigation actions.
My app has cache busting but it is only working when I update (reload) index.html.
How do I force the application not cache the index.html when navigating within my app and reload index.html on each page navigation click or action?
Here is my existing snippet index.html code:
<!DOCTYPE html>
<html lang="en" manifest="sw.appcache">
<head>
<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" />
sw.appcache file contents
CACHE MANIFEST
NETWORK:
*
Edit:
The following addition to the script tag within my index.html forces page to reload every time the url changes.
window.onhashchange = function() {
var parts = window.location.href.split("#");
window.location.href = window.location.protocol + "//" + window.location.host + "?t=" + (new Date()).getTime() + "#" + parts[1];
}
My experience with this in PHP is that you cannot ever control whether the browser decides to cache your page or not, despite whatever fancy headers you use.
The best way is to manipulate the URL with the request parameter.
Instead of http://example.com/mypage.html
Use: http://example.com/mypage.html?timestamp
Where timestamp is generated dynamically at runtime, and could be a random number or any dynamically-unique string you wish.
It's also a good trick to prevent browsers from caching CSS, JS, images, etc.
I have an angular2 app where I only want to force reload of the index.html page when the webpage is visited but I don't want to reload all the script files if they have already been downloaded.
Is this possible using a meta tag? e.g.
<meta http-equiv="expires" content="0">
If you use pragma meta, your index.html will not be cached but dependency may be cached anyway :
<meta http-equiv="pragma" content="no-cache">
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 have page INNER loading in an iframe in page OUTER. I'm noticing that when I've updated some of the CSS and JS files that INNER loads, when refreshing OUTER, the updates don't show. Is there a way to force INNER to check for changes in CSS and JS upon every load?
Add the following code to the Inner Web Page (loaded within the iframes)
<head>
<meta http-Equiv="Cache-Control" Content="no-cache">
<meta http-Equiv="Pragma" Content="no-cache">
<meta http-Equiv="Expires" Content="0">
</head>
You can also do it from the parent page:
document.getElementById(FrameID).contentDocument.location.reload(true);
or perhaps
parent.frames[FrameID].window.location.reload();
Furthermore, a workaround sometimes used is to re-assigned the src attribute's value. However, this is not guaranteed to provide a full refresh. This is sometimes coupled with adding a querystring value when resetting the src. Example: domain.com/page?id=123