Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

My HTML5 Application Cache Manifest is caching everything

Tags:

UPDATE:

** I posted this question when this feature was really new, I realize now that this feature should not be used this way unless it is used via JavaScript. but seems like this hack is a great solution for most beginners who make the same mistake and misuse of this feature. If you want to cache everything except your HTML this should be done with JS or you could use the solution below **

I guess my question boils down to this: If the file referencing the manifest using the manifest attribute of the HTML tag falls under the MASTER CACHE ENTRIES how could you have a dynamic page use the manifest.

My file looks like this:

CACHE MANIFEST  CACHE: # IMAGES: /stylesheets/bg.jpg /stylesheets/cont_bg.png #and so forth..   #EXTERNAL http://chat.mydomain.com/themes/images/panel_bg.png http://chat.mydomain.com/themes/images/images_core.png  #################################### #STYLE SHEETS: /stylesheets/min.css /stylesheets/css_night.aspx  ##################################### #JAVASCRIPT: /JAVASCRIPT/header_javascript.js  #EXTERNAL: http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js  FALLBACK: / /offline.php  NETWORK: * 

Now the problem is once I browse a page not in the manifest, my actual dynamic php files like index.php, when I first see the page and there in no cache chrome goes:

Adding master entry to Application Cache with manifest http://208.109.248.197/manifest.appcache  Application Cache Downloading event Application Cache Progress event (0 of 28)  ... Application Cache Progress event (28 of 28)  Application Cache NoUpdate event 

So far so good until I actually load a page, and chrome goes:

Application Cache UpdateReady event Adding master entry to Application Cache with manifest http://mydomain.com/manifest.appcache 

now as you can see in the last line it adds index.php to my application cache and I have verified this by going to url: chrome://appcache-internals/

It says:

Flags   URL Size (headers and data) Explicit,   http://mydomain/JAVASCRIPT/header_javascript.js 57.5 kB Master, http://mydomain/home.php 51.2 kB Master, http://mydomain/index.php   53.5 kB Master, Fallback,   http://mydomain/offline.php 49.4 kB 

where things like index.php and home.php are not supposed to be cached. I would like to tell it to not cache any html extensions if possible. But here is what I have learned from various RFC I believe: An online whitelist wildcard flag, which is either open or blocking.

The open state indicates that any URL not listed as cached is to be implicitly treated as being in the online whitelist namespaces; the blocking state indicates that URLs not listed explicitly in the manifest are to be treated as unavailable. 

well I would like to use one of these online white-list wildcard flags and set it to blocking but I can not find any explanations or examples further more. I also read:

zero or more URLs that form the online whitelist namespaces.  These are used as prefix match patterns, and declare URLs for which the user agent will ignore the application cache, instead fetching them normally (i.e. from the network or locale HTTP cache as appropriate). 

I would also like to use some pattern like this but then again I can find no documentation. Why is there no sign of appcache manifest documentation and no other website I've been to is using it , since my chrome appcache directory shows none!?!?

Thank you for your time!

like image 977
Neo Avatar asked Feb 15 '12 02:02

Neo


People also ask

What is the difference between HTML5 application cache and regular HTML browser cache?

HTML5 provides application cache, which means that a web application is cached, and accessible without an internet connection. whereas HTML browsers use caching to store HTML web pages by storing a copy of visited pages and then using that copy to render when you re-visit that page.

What does cache do in manifest file?

The CACHE section contains files you want to load and store on the user's machine. The first time the user loads your app, the browser will store all the files in the CACHE section of your app cache manifest.


1 Answers

Here is a hack I found out by playing around:

I haven't found the ultimate answer but from what I've learned it seems that the manifest is not meant to be set on every page. Again I'm not sure but this is a hack that I came across. I have a page such as manifest.html that has the

<html manifest="manifest.appcache">  

I learned that pages which do not have this will not be added to the cache however they will still continue using the application cache if on the same domain. Therfore if you include manifest.html a plain html page that has this in an iframe on everypage it will not cache that page like chrome will no longer output:

Adding master entry to Application Cache with manifest  

but if you go to network tab you will see that it is using the cache

<iframe id='manifest_iframe_hack'    style='display: none;'    src='temporary_manifest_hack.html'> </iframe>  

content of temporary_manifest_hack.html:

<!DOCTYPE HTML> <html lang="en" class="no-js" manifest="manifest.appcache">     <head>         <meta charset="utf-8">         <title>Hack 4 Manifest</title>     </head>     <body></body> </html> 
like image 58
Neo Avatar answered Sep 28 '22 10:09

Neo