Navigate back to the homepage

HTML5 Manifest File & Nginx

Bulkan Evcimen
May 9th, 2013 · 1 min read

Photo by Clément H on Unsplash

Ive been developing a HTML5 game using the LimeJS framework. As I am targetting iPhone and iPod Touches I asked my lovely girlfriend fiance to design me an app icon and hopefully In the near future she will also have give startup images too.

As I dont want to load the icon and startup images via the network every time the app loads, I thought I would cache it “offline”. To do this you need to create a manifest file which your web server needs to set a specific content-type header which is just text/cache.manifest.

To load a manifest file you need to add an attribute called manifest that points to your manifest file. It can be a relative path.

2<html manifest="mysite.manifest">

Here is how the rest of my HTML file looks like

3 <title>site</title>
4 <meta name="apple-mobile-web-app-capable" content="yes"/>
5 <link rel="apple-touch-icon" href="/assets/icon.png"/>
6 <script type="text/javascript" src="site.js"/>
8 <body></body>

The manifest file tells the browser which files to store locally, the syntax for it kind of reminds me of INI files, but not quite. My manifest file looks like following;


This tells the site to cache/store the png image for the app icon. The file listing following the NETWORK: section tells the browser to always load the files from the network. More info is available in this link

If you are using Nginx like I am, then you need to change the file mime.types and add the following

1text/cache.manifest manifest;

Which just tells Nginx to serve up file resources ending with manifest with the content-type header of test/cache.manifest.

Hope this helps.

More articles from Bulkan

Install Shield Silent Installs

Photo by Kristina Flour on Unsplash Install Shield has this nifty feature of being able to install packages in silent mode. This means that…

November 30th, 2009 · 2 min read

Running QTP tests using Python

Photo by Bruce Tang on Unsplash QTP provides an interface called the automation object model . This model is essentially a COM interface…

September 18th, 2009 · 1 min read
© 2007–2020 Bulkan
Link to $ to $ to $