How to clean browser cache with the help of the code - caching

I've made a lot of changes in the front end part of the project. But for applying them all users should clear the browser cache. Is there any way for cleaning users browsers cache from programming side?

Yes, you need to version your static files. I use this trick:
<link href="/css/style.css?v=<?php echo filemtime($basepath."/css/style.css")?>" rel="stylesheet" type="text/css" />
Obviously that code will need adjustment, but you get the idea. It appends the file modification time as a version number on the file. So that every time it is changed (and only when it's changed) it completely busts the cache server and client side. Saves all those "I can't see any changes" calls from the clients! :)
Of course if you don't want to go the automatic route, you need only append the css (js etc) files with ?v=1.0 for example

Related

Can I make my ajax website 'crawlable'?

I'm currently building a music based website and I want to build something like this template. It uses ajax and deep linking. (And it makes use of the History.js library - please notice how there's no '#' in the URLs.)
The reason I want to use these 'ajaxy' methods (or maybe use the template altogether) is so that when music is playing, it will remain un-interrupted as the user navigates the site.
My worry is that my site wont be crawlable by Google but I think I can modify code in the page source to fix that. If I look at the source code to the template, in the head I see
<meta name="description" content="">
<meta name="author" content="">
<meta name="keywords" content="">
Now if I add this to the head:
<meta name="fragment" content="!">
will that make the site crawlable? Is there other code I need to add on top of this? Or is it just not possible for this template?
I'm following this guide https://developers.google.com/webmasters/ajax-crawling/docs/getting-started, and I'm on step 3. I will of course have to complete the other steps but I don't know I'm heading in the right direction, or heading towards a dead end!
Any help would be very much appreciated. Many thanks in advance.
From what you said it sounds like your site updates the address bar with clean urls as you navigate via ajax. That's good. The next thing is you want to do is make sure those urls work. If you directly go to a url do you see the specific content it represents. And would a crawler also see the correct content without running javascript. Progressive enhancement works well for that. The final thing is you want to do is make sure bots can pick up those urls.
I've not played with the meta tag for ! But it looks like it is only for the home page and you still need to implement the escaped fragment page. Maybe it does support other pages but the article does not cover that.

How do I correctly ENABLE browser caching using codeigniter?

Every time I do I search on this I get information about how to disable the browser cache.
Never anything about enabling it.
How do I get the back button to use the cache and not regenerate the page?
As far as I know you can control to force a browser to reload the data by means of these meta tags:
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-control" content="no-cache">
<meta http-equiv="Expires" content="0">
but you cannot force it to read from cache. The browser itself will do that for you if you don't explicitly specify to ignore the cache, and the page data are in fact cached and not expired.
This does not depend on CodeIgniter because it's client-side, but you might want to use the meta() function included in CI's html helper, which will simply output the corresponding meta tag. e.g:
echo meta('Cache-control', 'no-cache', 'http-equiv');
would generate the second code line above.
Note:
The 1st meta tag is specified for http/1.0 while the 2nd one is for http/1.1 but both are used to allow backwards compatibility.
If you're using xhtml instead of html remember to close the meta tags with />
Browser caching has nothing to do with codeigniter. You can use html meta tags to instruct the browser specifically not to cache pages or you can set a cache expiry for an individual page like so:
<meta http-equiv="expires" content="Mon, 10 Dec 2001 00:00:00 GMT" />
You could use a bit of php to drop tomorrows date in there. The browser (depending on settings) will usually pull as much as it can from the cache automatically, including when clicking the back button - the cache for the back button will work the same as if you were coming in from any other link.
You could set expires headers through your htaccess using something like the following on an apache server (you would have to ask about how to do this on other server types) to tell the browser that is should cache certain types of content for a given periods of time:
ExpiresByType text/html "access plus 60 seconds"
This will tell the browser to store anything of mime type text/html for 60 seconds (this includes codeigniter output) BUT DONT DO THIS if your dealing with dynamic content It will stop any dynamic page content being loaded and will stop any changes to your content being loaded by returning visitors (Obviously this second part is not such an issue with a 60 second cache).
The key thing to realise is that Your page is not one thing, it's made up of lots of parts, some of these parts should be called from cache (js, css, images, etc.) some should not (often html will fall into this category).
The browser will automatically call all the parts of your page from the cache where the cache has not expired.
Usually you would use .htaccess (or similar method) to cache your css, images, etc. (using versioning in filenames to force a reload when they change).
You should also take advantage of server side caching - codeigniter does this for whole pages but I dont tend to find this very helpful for any kind of dynamic site so I would take a look at for using phil sturgeons partial caching library for ci if you are interested in ss caching:
https://github.com/philsturgeon/codeigniter-cache
This wont stop a request being sent to the server but will mean that request requires less processing and can be served as one or several pieces of static content.

ColdFusion application caches switch statement

I'm not familiar with caching in coldfusion, but it seems it's doing somethnig it's not supposed to in my website.
I have only one index page, that uses a big switch statement to determin what cfm files to include, to build my website's pages. No everything works fine, I even have a default case that refers back to the homepage when trying to access a non-existing page.
When I create a new page and try to go to it but in the meantime forgetting I need to add a cfcase first, goes to the defaultcase. If I then create the needed cfcase, it should work, but it has cached the redirect of the last time, the path it followed in the switch/case, so I still get the defaultcase. Even if remove the defaulcase from the code, it still goes there.
Is there anyway to tell coldfusion to stop caching my switch/case. The rest of the content may be chached, no problem, just not the path of the switch/case..
edit 1
Here's my code:
<html>
<head>
</head>
<body>
<cfswitch expression="#attributes.fuseaction#">
<cfcase value="home">
<cfinclude template="dsp_home.cfm" />
</cfcase>
<cfcase value="admin">
<cfinclude template="admin/dsp_login.cfm" />
</cfcase>
<cfdefaultcase>
<cf_goto fuseaction="home">
</cfdefaultcase>
</cfswitch>
</body>
</html>
attributes.fuseaction is a variable that is stored in the url of the requested page, like so: http://www.domain.com/index.cfm/fuseaction/#switch/case-variable#.
cf_goto is a custom tag that gives a 301 code and redirects to the specified page where that variable is home.
When I do what I described above, the headers still give me the 301 error code and de redirect to the default case page. So I'm at a loss what it is that's being cached here.
CF doesn't cache switch/case logic, so it's a red herring to be looking at that to solve whatever your problem actually is.
Do you - by any chance - have "Trusted Cache" switched on in CFAdmin? If so, you'll need to clear it so your CFM files recompile when they're requested, and your changes will take effect.
Failing that: we need to see your code, as per Duncan's suggestion.

How to hide the image tag src attribute?

I have a question about the <img> tag src attribute.
Is it possible to hide the <img> tag src attribute when viewing the source in a browser?
If it is possible, how? Please tel me if you have any reliable sources.
No, it's not possible.
You can set them dynamically with JS, but you can't hide them. You can store them as base64 encoded strings, and then decode them on the fly which will "hide" them from your page's source.
However, this is still utterly pointless as in the end, the browser still makes an HTTP request to fetch the image.
Simply spoken: This is impossible.
You might try to obfuscate your image src attributes (JS, Base64, etc), but for the browser to be able to show an image, you'll always end up exposing the image URI.
Which, in turn, means that everyone who knows their firebug will be able to see where your cute kitteh image comes from.
Alternative:
Generate One-Time URIs for your images (quite expensive).
Another good feature is to hide the location paths of your important scripts. I found a great npm plugin for this https://www.npmjs.com/package/location-hide
This works also for php href, src, content it will use everything inside src=""
You need only node.js for creating the exported files. It´s easy to use even if you don´t know node.js
It turns
<script src="test/folder/sample.js" type="text/javascript"></script>
<link href="test/stylesheet/perfect-scrollbar.css" rel="stylesheet">
into
<script src="TNANIuTOLZfmLYwaPDIYhcZDVOWKodqYhysaTeQHFPDhYlDLCOtxZqYmkKAhaSwSgbsYOWlpBzVSBtMZKSfwRqvPSqWVlBBuzHR" type="text/javascript"></script>
<link href="gyXeFnOEvZbgTjLvdZRnsyrfhaXqffkDjcdATTouqpIenCalLRXKamuXEtiKbPGCsNrdQIaqTMTNWsLyLFuxygKytaruWzSjKYMq" rel="stylesheet">
And it generate new jquery include codes like this to include your scripts with javascript in a external file
$('[src=\'TNANIuTOLZfmLYwaPDIYhcZDVOWKodqYhysaTeQHFPDhYlDLCOtxZqYmkKAhaSwSgbsYOWlpBzVSBtMZKSfwRqvPSqWVlBBuzHR\']').attr("src", "test/folder/sample.js")
$('[href=\'gyXeFnOEvZbgTjLvdZRnsyrfhaXqffkDjcdATTouqpIenCalLRXKamuXEtiKbPGCsNrdQIaqTMTNWsLyLFuxygKytaruWzSjKYMq\']').attr("src", "test/stylesheet/perfect-scrollbar.css")
Also I would suggest you that you include all of your external javascript codes in 1 single js file. This file you place in the root of your index file that you can make this
<script src="./allinone_external_file.js" type="text/javascript"></script>
Then make right htaccess that nobody can acces this file. You can also make a fake import script for the source code that every body can see. But this file is only a redirect for the real external js file. you make this multiple times as example + use other obfuscation tools. This will protect you from people searching exploits with your javascript codes. I know its no big deal and maybe you can see the jquery include codes if you know how. But anyway its a great protection.

Old content appearing on site. Auto Clear Cache?

I have a website that is updated regularly and I am having a problem where old content is showing up on the page. It can be fixed by refreshing a few times or clearing the cache. I am looking for a solution so no data is stored on the PC and the site is forced to refresh each time. Perhaps an auto cache clear plugin or something of the like? Any ideas?
This may sound like a good idea at first but how many users do you hope to support in the future?
I ask because if every request should be completely refreshed every time you are going to have a LOT of traffic on your web server. And, your users are going to start complaining about page load times.
With help from tools like yslow and firebug, we've tried to analyze the portions of our pages that can be cached and those that can't. Tip of the iceburg, but...
Images to support site layout - backgrounds, buttons, etc. should be cached for a very long time. They go in a folder tree flagged by IIS as cachable for a long time. They could be delivered by a CDN long-term. If these have to change, we upload new files with new names.
Script/CSS and other, possibly-changing content goes in another folder that gets a shorter cache duration. This could be a problem if we have to fix bugs, but again, upload a new file with a new name if necessary.
Anything data-driven (our app is a catalog) is localized and gets refreshed every time.
This is still a work-in-progress for us, but we're seeing MUCH less server traffic and MUCH faster page load times.
I hope this helps!
use this, my son
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="expires" content="0">
Try putting this in your head tags
<meta http-equiv="cache-control" content="no-cache">
Edit Just a note, this doesn't force the browser not to cache it, but most browsers will listen
i suggest u to try this one , I use this way when my code still on production
<link rel="stylesheet" href="styel.css?v=<?= time(); ?>">
but when u're ready for live mode, put the latest version of ur css, or whatever u want like ?v=1.1
hope it will helps u

Resources