I have an EJS file which I'm rendering with the help of express.js using a code like res.render("example", {}).
However, the problem is when I modify and save the EJS file the results cannot be seen immediately by pressing the refresh key in the browser and I have to restart the node server in order to see new version of the file. But I remember in other projects that was not the case and pressing the refresh immediately reflected the changes in the browser. What am I missing here? I am using the latest version of EJS.
Related
I'm developing a web app and having a weird issue where my testers' browsers are fetching newer JavaScript files but using cached HTML files.
My scripts have query parameters, which I updated when I push a new HTML file, to ensure the browser isn't using older cached code:
<script src="code.js?version=1></script>
When I update code.js, I also increment the version parameter in the script tag on page.html.
My testers are hitting errors on Chrome on Android. When Chrome is reopened from the background after I push a new version of both files, apparently Chrome fetches the new code.js but uses the cached page.html.
This is problematic when the new JavaScript references newly added HTML elements that don't exist in the cached version of page.html.
Under what circumstances would the browser re-fetch a JavaScript file when, as far as it knows, the HTML page itself hasn't been changed? The HTML file is still pointing to the old version query string, so shouldn't that exact path still exist in the cache?
I've since migrated to using RewriteMod to let me inject version numbers into filenames, but I'd still like to understand why files with query strings aren't being retrieved from the cache when the query string hasn't changed.
I have a SPA Angular website. Whenever we release a change to the website, the user's browser does not go back to the server to get the new javascript files. The app happily keeps running in the user's browser, and while it will make ajax calls for data, the javascript files do not change. This can cause errors if the signature of the back-end API being called changes, etc. If the user refreshes the page, they get the updated javascript files and everything works fine after that.
Is there a way to tell the browser that the site has been updated and to get the new javascript files, rather than just running the app with the same files?
I use the Angular CLI to build the application, so when the website is released, the javascript files have hashes at the end etc. This isn't an issue with files being cached and not updated... it's an issue with the browser knowing that it needs to request the files or refresh the page.
You could use web workers to poll the server for changes and refresh the browser when changes are found.
An alternative to web workers is using setInteterval just refresh after a given time.
Yet another alternative is to have a version number in your API responses, and the JavaScript handlers would refresh the page when the version numbers are out of sync.
You could write a program in your angular code that:
periodically checks the version of the api if changes where made
does the periodic check to ascertain when the user is idle AND when the user is not in a edit page with dirty fields.
refreshes the page when step 2 condition is met
use this library to watch idleness
https://github.com/shawnmclean/Idle.js
If the file udated have the seame name add this text after the "?" like "?ver1.1" is suppose to tell the browser that there is a new version of the file.
you can use manifest file
https://html.spec.whatwg.org/multipage/offline.html#manifests
another way is with
CacheStorage,clear()
I am making a full stack application using Django. I have some client-side Javascript written in a file called logic.js. I noticed that sometimes when I make changes in the logic.js file and then hit refresh in the browser, the browser's logic.js file doesn't change. However, if I open the site in another window, it gets the updated logic.js file. I am perplexed by this behavior of my browser (if it a browser problem). Why is this happening?
For local development, make sure to disable the cache in you browser to make sure it always requests new data from the local server.
Yeah, that will happen. I usually add a version in the template like:
<script src="{{ STATIC_URL }}app/js/filename.js?v={{ VERSION }}"></script>
where version is changed whenever I release an update. This should force the browser to grab the updated file.
On cloudflare I want to disable caching and see my website changes immediately that I've pushed live.
Things I've tried:
I've put development mode on.
Create a bypass on caching in page rules.
Purged an individual webpage.
Purged the website.
Set cache to clear every 2 hours.
None of the above worked.
Tech I'm using:
Angular2
SystemJS
Typescript which becomes javascript on build.
Firebase for hosting and database.
Cloudflare for SSL etc.
The only way people see my website changes, it if they hard refresh.
The main problem is I've got a javascript file called app.js and its has all my javascript in for my Angular app. And it doesnt seem like its trying to get the resource in the browser.
I've changed the app.js to app.js?1490959855777
And still doesnt fetch the file again.
I basically want to see my JS file without a user having to hard refresh.
Based on the discussion above, it looks like the caching is happening on the browser - since a hard refresh will get the new file contents.
I think what happened is CF told the browser to hold onto that file for a very log time. And the browser is listening to that request.
Because you can't ask your users to do a hard refresh, you'll need to rename the static files that are being cached so aggressively.
I have a dotnet web application running on a server with IIS7. I have to replace 2 .js files. Some pc's are getting the new file and other are not. I tried to update the time-stamps on the web.config file and those two .js. There is no specific caching set.
How can I force the browser (IE11 in my case) to go get the file from the server and not use the one in the local cache? I won't go on every users pc and clear there cache. I need a better solution and everything I tried so far is not working.
thanks!
You can add something unique to the script tag like:
<script src="myscript.js?version=1.1"></script>
This will force the browser to fetch the new verison.