Web page doesn´t update automatically when uploading new content - html

I´m creating a static web page with HTML and CSS, the problem comes when I upload new info into the server. When I try to reload the page nothing changes. It only changes when I make a ctrl f5 reload. Is there a way to make the site to reload itself so the user can see the newest info every time they enter the web site?
I tried using a "?" sing ager calling the CSS file but it's not working
link href="CSS/styles.css?v=1.1" rel="stylesheet"

Static content is cached by the browser. If the server sends a max-age then the browser will not attempt to get a new version unless the cache is expired as per the max age.
However ctrl-F5 forces a refresh disregarding the aging parameters.
You can try setting a shorter max-age on the server, but that will cause more load as the clients will fetch resources more frequently.

Most likely, your browser is caching the content of your website when you visit it.
The next time you visit, it'll show the native, cached copy (unless you "hard-refresh" it eg(Ctrl + F5)).So you need "Cache Busting"
You can follow this article, it may help you.
https://css-tricks.com/strategies-for-cache-busting-css/
Thank You...

Related

How to force HTML Page Refresh from Server

Currently, I am facing an issue with HTML page. So here if a user visited the site then the browser is caching the entire HTML page. So when the user hits the URL again then the browser taking that HTML from the cache instead of calling/requesting to the server for HTML contents. Here our Team member forgot to add meta tags which would force the browser to take content from Server each time. Is there any way that we could resolve the issue? Since the page request itself not reaching the server so User will not see the refresh contents of the website. If user do Ctrl+F5 then they can see updated contents. I went through many sites and stack overflow questions but I did find a solution for forcing HTML page to load contents from server using meta tags.But existing users is there any resolution that we could apply?
Problem is here the page did not call server to get contents it just loads from cache.
There's nothing you can do.
You've previously instructed the browser to cache the file (presumably for a long time) and not check for updates (via ETags or If-Modified-Since) so it is going to use the cached version until its cache expires (from the user intervening or automatically (which might be sooner than your caching instructions said)).
There's no way to provide new caching instructions to the browser without it requesting them from the server (which it won't do because of the existing rules).

automatically refresh client browser if server page has changed

I could not find any useful solution for my TYPO3 extension.
The extention gets new informaion about every 3 minutes.
Right after the page on the server is changed, the browser should be trigged to refresh page, or better only the part which is embedded into a div section.
I have seen several pages on the internet, which always automatically update the page content.
Has anybody already done it?

Exclude page self by appcache

I have an appcache (with NETWORK *). So now I visit my page with <html manifest="/cache.appcache">. Then the page itself is cached as all the images are. But I want the page self to not be cached. How can I do this? I thought NETWORK * would do the trick.
Regards,
Kevin
The appcache manifest always caches the master page.
If you are using Chrome check the cached files for your page here: chrome://appcache-internals
A workaround could be to put a hidden iframe somewhere on your page, which contains the appcache file to cache offline content. (take a look at "Preventing the application cache from storing masters with an iframe" here: http://labs.ft.com/2012/11/using-an-iframe-to-stop-app-cache-storing-masters/ )
A better solution could be to write your page to fetch new content from your server when it is opened - if the server cannot be reached, it can serve the last known content from the HTML5 local storage.
I have tried the iframe work around, and find it ripe with errors. Most browsers cache the data for the iframe where the page cannot get it.
Instead make the page's content load via AJAX. Basically have a blank html page with the manifest and javascript which pulls and adds its content from the server. This way only the blank html is cached, and content is always updated from the server.
Converting a page to this method can be very difficult, but it works. Making sure the appropriate javascript gets run at the correct time, probably requires some detangling. Moving around server code which won't be called when pulling from cache to the new ajax method.
Note: no need to pull conditional content from the server if the condition is in the query string, different query strings make a separate cache

Dynamic Image won't display correctly

I have a very basic page that displays a dynamic image. Here is my very simple code:
<html>
<body>
<p><img width=1024 height=768 src="../image/someImage.jpg"></p>
</body>
</html>
The image gets refreshed every minute by another program. The issue is that occasionally the html page will not display the updated image on anyone's computer, so it isn't a local cache issue. I am using IIS6. The only way to get it to display the updated image is by stopping and starting IIS for that site.
My company only uses IE, but I tried looking at it in FireFox as well and it did the same.
For a quick fix, append a question mark and a random number to the end of the image path. PHP Example:
<img src=".../images/someImage.jpg?<?=rand(1,100000)?>">
The real root of the problem could be expiration headers. You may want to configure the headers for images to expire sometime in the past. Google around for expiration headers.
Try to disable IIS7 cache:
Start IIS Manager (type IIS into search programs and files in start menu)
Navigate to desired site in the Connections tree (Default Web Site)
Open Output Caching
Edit Feature Settings
Uncheck Enable cache and Enable kernel cache

How do I configure optimal cache policy for index.html page in my site?

I have a web site with an index.html homepage that is updated from time to time. We sometimes add offers for our clients, special messages and so on, which have to be visible by next day for everyone.
If index.html is cached by browsers, many users will not notice that anything has changed, unless they explicitly refresh the contents of the page...
Which is the best way to be sure that 100% visitors have an up-to-date index.html page, without compromising cache performance?
My best answer would be to skip out on updating the index.html each time and go with a server-side programming language, like PHP. You can then set the headers for the page to not cache, and you can also set up an admin page that you can use to change the content. Or you could go with a browser-side script with JavaScript using AJAX. Then the page has an ability to update before the next loading of the site.