Cache manifest and query strings - html

I am investigating using a cache manifest. If I have a manifest such as:
CACHE MANIFEST
stylesheets/style.css
And in the page I have a CSS element referencing stylesheets/style.css?v=123.
Will the style.css file be retrieved from the cache or remotely?

The URL in the cache manifest and the URL you're calling must match (INCLUDING the query).
In your example:
CACHE MANIFEST stylesheets/style.css
in HTML: stylesheets/style.css?v=123
The browser will ALWAYS try to fetch the CSS file from the server, since only the query-less CSS file is cached locally. Use of stylesheets/style.css in cache is sufficient.

Just an additional note: if you have HTML pages that expects data in query strings, you could store the same data in localStorage and after redirection can get access the same data in the other page from localStorage.
That is how I solved passing data between pages where we cannot use the query string option with offline cache manifest files.

When you don't have any network connection and want to access that page, it will fetch locally.

Related

Do browsers cache JSON

I want serve a JSON from a storage bucket. The JSON data will be updated periodically, but the URL will remain the same (I don't want to have to redeploy my site with an updated URL every time the JSON is updated). But I know that if this was CSS I would have problems with the browser caching the file and not fetching the updated data. Do browsers cache JSON like they do CSS?
Yes. Caching related headers and (how they are handled) work for all HTTP resources. The file type isn't relevant.

how to embed pdf file in html with security?

I am using below code to display pdf file in HTML
<object data="data/file.pdf" type="application/pdf" width="300" height="200">
test.pdf
</object>
But In above code we have to specify path name and folder name so it is not so secure. Crawler can find this path, so using some algorithms(robot) it is very easy to download other file those are stored in that folder.
How to secure this, is there any option to prevent this from robots?.
You may do the following:
Password protect the page (with the server-side code).
Generate unique links like (/getpdf/some_random_string_or_md5_hash_of_random_string.pdf) for every PDF file (using server-side code) that will a) check for the current time and the validity of the random name generated (if it has expired or not) then b) will redirect to the source files (not really hiding the source because of the redirection) to be displayed or stream the PDF file content (this is more secure though could seriously add the load to the server).
Finally add robots.txt to the folder and hope that crawlers will follow restrictions it sets.
If the other files in the directory are not to be downloaded, ever, they shouldn't be in a directory that is available to the http server. You can use directory permissions in your http server (eg., config directives and .htaccess in Apache) to control access to directories. Only configure access for directories you need to expose to the web, and only store files in them that you want the web to access.
If you want to avoid including a path in the HTML, you will need to write some dynamic code (eg, php, asp, or any number of server-side options). Your code on the server would need to handle the request for the file and return the file's content manually.

Temporary file handle storage in HTML5

Is it possible to obtain file handles in HTML5 and store it as a blob in webDB for upload later?
(Upload selected images when the 3G network is available again, without re-selecting the files.)
The HTML5 will be loaded from the local client device and
action="http://.../insert.jsp"
be used to upload the files to the server.
Any help or ideas will be very useful.
C-:
Any File object can be converted to an URL.
It is simple to do by using object URLs as described by:
https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications
(I still have to confirm that the URLs remain valid across sessions.)
And it does not remain valid across sessions in Chrome!

html5 local storage for offline viewing

I have a folder, which contains html files, images, stylesheets, and js.
I have uploaded it to the server and when i open it on ipad, all the content should get stored on iPad for offline viewing. How can this be done using webstorage / local storage?
I tried with offline cache but it has its limit of 5MB
Your webserver has to support this by adding
AddType text/cache-manifest .manifest
to your .htaccess or server config.
then you need a manifest file, which says the client "store these files locally". Just create a blank file call it something like "data.manifest" and add this:
CACHE MANIFEST
CACHE
index.html
style.css
etc..
There are many more things you can do in this manifest file. I consider using Google or the search for this.
At least you have to edit your <html>-tag for your manifest file to your site.
<html manifest="/data.manifest" />
That's it. The browser should ask you whether it should store data locally.
You have to split your app in two. A downloader and the actual app.
The downloader will download the required files once and save it to localstorage/webstorage. Once saved your app can be loaded from local copy directly. The downloader part will be saved using cache manifest mechanism.
I am currently developing an app which works in the same way.
Note: JS and CSS files can be saved directly to localstorage, but for images you have to convert them to base64 and then use them. Watch out for the base64 size limitations.
http://en.wikipedia.org/wiki/Data_URI_scheme

More than 1 cache manifest file?

Is it possible to use more than one cache manifest file?
Does the html manifest attribute support more than one file?
If it does, how can i do that?
The idea is to include files in the cache list whitout losing the cache of the earlier files. That's because when we change the manifest file, the files in the list are downloaded again.
No, for a given page you can only have 1 cache manifest file.