How do i allow json requests when using HTML5's appcache feature?

Question

When i added appcache to my webapp running jquery mobile, all the ajax-calls requesting json-files from my server stoppet working. My manifest-file looks like this:

CACHE MANIFEST

CACHE:

index.html
scripts/jquery-1.7.1.min.js scripts/jquery.flot.min.js
scripts/jquery.flot.threshold.min.js
scripts/jquery.mobile-1.0.1.min.js
styles/jquery.mobile-1.0.1.min.css
styles/touchStyles.css
styles/styles.css

NETWORK: 

index.appcache
dataFetchAndDraw.js
initJson

Where initJson is one of the calls that won't work. i've tried to enter the full address(aaa:bbb:ccc:ddd:6565/initJson) also without success.

In my .htaccess file i only have this one line:

AddType text/cache-manifest .manifest

Harry

Answer 1

I just ran into this issue and had to add a wildcard to the NETWORK section of the manifest file to allow the browser to go to the network for any non-cached resources.

NETWORK:
*
http://*

You apparently need both wildcard entries above to support all the browsers.

I also found appcachefacts.info a useful resource to understand this and other specifics about appcache. I recommend reading this all the way through before continuing up the appcache learning curve:

The NETWORK section lists all URLs that may be loaded over the Internet. If your application includes any API calls, make sure to enumerate them here. Note that this is a list of URL prefixes, so if all of your network calls begin with http://example.com/api/, that's all you need to include.

If you want to allow arbitrary URLs to be accessed (scripts, stylesheets, API calls, anything), include*, http://* and https://* in this section. (Chrome and Safari respect the*; Firefox needs the http://* and https://*.)

Adulate

This really should be the default. HTML5 AppCache doesn't seem well implemented or specified at all. The browser should render the cached page and then download a new page in the background if there's a connection to update the cache with every reload. But instead it forces a kind of offline mode, even when the user has a connection. – Kling

Answer 2

I had a similar problem with an application I was working on, the problem I had was the cache flag in the ajax call was defaulting to true.

I found that when I added

cache : false

to my ajax GET request the request hits the server. (http://api.jquery.com/jQuery.ajax/)

Walke

Answer 3

I throw for this problem today. But in my case work only with two steps:

1. $.ajax({ url: "/myurl", cache: false, ...})
2. Config appcache NETWORK session with

I hope it's useful for you.

Joel