Isomorphic (browser and node) JavaScript library that adds offline support to fetch by caching requests in:
sessionStorage
localStorage
- IndexedDB & WebSQL when used with localForage
- Disk when used with node-localstorage
Offline is detected when a request times out or navigator.onLine === false
. offlineFetch
is a wrapper around fetch
so it can be used as a drop in replacement. Requests are only cached if an offline
option is provided.
Few things to note:
- You have to issue a request with
offline
option present to utalise cached copy - HTTP header
x-offline-cache
will exist request handled by offline-fetch x-offline-cache
=MISS
will exist if cache not usedx-offline-cache
=HIT
if serverd from offline cache
Copy offline-fetch.min.js into your page and add a script tag:
<script src="path-to/offline-fetch.min.js"></script>
Install via npm:
npm install offline-fetch
Require in your module:
// make `fetch` avaliable globally
require('isomorphic-fetch');
var offlineFetch = require('offline-fetch');
// require node replacement for localStorage
var { LocalStorage } = require('node-localstorage');
// add instance to global namespace
global.localStorage = new LocalStorage('./local-storage');
Replace fetch
with offlineFetch
and pass in additional parameter:
var options = {
// typical fetch property
method: 'GET',
// new offline property with optional config
offline: {
storage: 'localStorage', // use localStorage (defaults to sessionStorage)
timeout: 750, // request timeout in milliseconds, defaults 730ms
expires: 1000, // expires in milliseconds, defaults 1000ms (set to -1 to check for updates with every request)
debug: true, // console log request info to help with debugging
renew: false, // if true, request is fetched regardless of expire state. Response is and added to cache
// timeouts are not retried as they risk cause the browser to hang
retries: 3, // number of times to retry the request before considering it failed, default 3 (timeouts are not retried)
retryDelay: 1000, // number of milliseconds to wait between each retry
// used to generate per request cache keys (defaults to URL + METHOD hash if not provided)
cacheKeyGenerator: function(url, opts, hash) {
return 'myapp:' + url;
}
}
};
offlineFetch('http://www.orcascan.com/', options).then(function(data){
// data contains response...
});
Supports any global localStorage
-like API, including promised based getItem
, setItem
.
- Checkout using
git clone https://github.com/john-doherty/offline-fetch
- Navigate into project folder
cd fetch-reply-with
- Install dependencies
npm install
- Run the tests
npm test
- Fork it!
- Create your feature branch:
git checkout -b my-new-feature
- Commit your changes:
git commit -m 'Add some feature'
- Push to the branch:
git push origin my-new-feature
- Submit a pull request
For change-log, check releases.
Licensed under MIT License © John Doherty