Enabling an HTML application for offline use in iOS

I have a couple of single-page HTML / JavaScript applications I’ve built that can be loaded onto an iPad or iPhone for use when offline (10,000' in the air, or buried in an ancient concrete-and-steel courthouse building). Steps required (paraphrased from, e.g., here):

Create a cache.manifest file

Mine are pretty simple; here’s an example:

CACHE MANIFEST

# Serial number 2

apple-touch-icon.png

index.html

Make sure the web server is properly configured to serve .manifest files with the proper MIME type (text/cache-manifest). Here, I’m verifying that using Lynx (I’ve highlighted the MIME type information in bold):

$ lynx -head -dump http://www.punctumarchimedis.com/garmin/cache.manifest

HTTP/1.1 200 OK

Date: Sun, 15 Sep 2019 22:41:32 GMT

Server: Apache/2.2.15 (CentOS)

Last-Modified: Sat, 02 Mar 2019 05:05:41 GMT

ETag: "80797-41-5831579a458e8"

Accept-Ranges: bytes

Content-Length: 65

Connection: close

Content-Type: text/cache-manifest

Modify the HTML file metadata

The highlighted text is what was added to the standard HTML file to enable offline caching and operation:

<head>

<title>ForeFlight to Garmin Coordinates Converter</title>

</head>

Here’s one of the apps: http://www.punctumarchimedis.com/garmin/

Edit: It appears this mechanism is deprecated (or at least, so complaints the desktop version of Safari). Eventually I’ll sit down and figure out Service Workers.

Search This Blog

A Geek Goes Flying