localForage

NPM version npm jsDelivr Hits minzipped size

localForage is a fast and simple storage library for JavaScript. localForage improves the offline experience of your web app by using asynchronous storage (IndexedDB or WebSQL) with a simple, localStorage-like API.

localForage uses localStorage in browsers with no IndexedDB or WebSQL support. See the wiki for detailed compatibility info.

To use localForage, just drop a single JavaScript file into your page:

<script src="localforage/dist/localforage.js"></script>
<script>localforage.getItem('something', myCallback);</script>

Try the live example.

Download the latest localForage from GitHub, or install with npm:

npm install localforage

Support

Lost? Need help? Try the localForage API documentation. localForage API文档也有中文版。

If you're having trouble using the library, running the tests, or want to contribute to localForage, please look through the existing issues for your problem first before creating a new one. If you still need help, feel free to file an issue.

How to use localForage

Callbacks vs Promises

Because localForage uses async storage, it has an async API. It's otherwise exactly the same as the localStorage API.

localForage has a dual API that allows you to either use Node-style callbacks or Promises. If you are unsure which one is right for you, it's recommended to use Promises.

Here's an example of the Node-style callback form:

localforage.setItem('key', 'value', function (err) {
  // if err is non-null, we got an error
  localforage.getItem('key', function (err, value) {
    // if err is non-null, we got an error. otherwise, value is the value
  });
});

And the Promise form:

localforage.setItem('key', 'value').then(function () {
  return localforage.getItem('key');
}).then(function (value) {
  // we got our value
}).catch(function (err) {
  // we got an error
});

Or, use async/await:

try {
    const value = await localforage.getItem('somekey');
    // This code runs once the value has been loaded
    // from the offline store.
    console.log(value);
} catch (err) {
    // This code runs if there were any errors.
    console.log(err);
}

For more examples, please visit the API docs.

Storing Blobs, TypedArrays, and other JS objects

You can store any type in localForage; you aren't limited to strings like in localStorage. Even if localStorage is your storage backend, localForage automatically does JSON.parse() and JSON.stringify() when getting/setting values.

localForage supports storing all native JS objects that can be serialized to JSON, as well as ArrayBuffers, Blobs, and TypedArrays. Check the API docs for a full list of types supported by localForage.

All types are supported in every storage backend, though storage limits in localStorage make storing many large Blobs impossible.

Configuration

You can set database information with the config() method. Available options are driver, name, storeName, version, size, and description.

Example:

localforage.config({
    driver      : localforage.WEBSQL, // Force WebSQL; same as using setDriver()
    name        : 'myApp',
    version     : 1.0,
    size        : 4980736, // Size of database, in bytes. WebSQL-only for now.
    storeName   : 'keyvaluepairs', // Should be alphanumeric, with underscores.
    description : 'some description'
});

Note: you must call config() before you interact with your data. This means calling config() before using getItem(), setItem(), removeItem(), clear(), key(), keys() or length().

Multiple instances

You can create multiple instances of localForage that point to different stores using createInstance. All the configuration options used by config are supported.

var store = localforage.createInstance({
  name: "nameHere"
});

var otherStore = localforage.createInstance({
  name: "otherName"
});

// Setting the key on one of these doesn't affect the other.
store.setItem("key", "value");
otherStore.setItem("key", "value2");

RequireJS

You can use localForage with RequireJS:

define(['localforage'], function(localforage) {
    // As a callback:
    localforage.setItem('mykey', 'myvalue', console.log);

    // With a Promise:
    localforage.setItem('mykey', 'myvalue').then(console.log);
});

TypeScript

If you have the allowSyntheticDefaultImports compiler option set to true in your tsconfig.json (supported in TypeScript v1.8+), you should use:

import localForage from "localforage";

Otherwise you should use one of the following:

import * as localForage from "localforage";
// or, in case that the typescript version that you are using
// doesn't support ES6 style imports for UMD modules like localForage
import localForage = require("localforage");

Framework Support

If you use a framework listed, there's a localForage storage driver for the models in your framework so you can store data offline with localForage. We have drivers for the following frameworks:

If you have a driver you'd like listed, please open an issue to have it added to this list.

Custom Drivers

You can create your own driver if you want; see the defineDriver API docs.

There is a list of custom drivers on the wiki.

Working on localForage

You'll need node/npm and bower.

To work on localForage, you should start by forking it and installing its dependencies. Replace USERNAME with your GitHub username and run the following:

# Install bower globally if you don't have it:
npm install -g bower

# Replace USERNAME with your GitHub username:
git clone [email protected]:USERNAME/localForage.git
cd localForage
npm install
bower install

Omitting the bower dependencies will cause the tests to fail!

Running Tests

You need PhantomJS installed to run local tests. Run npm test (or, directly: grunt test). Your code must also pass the linter.

localForage is designed to run in the browser, so the tests explicitly require a browser environment. Local tests are run on a headless WebKit (using PhantomJS).

When you submit a pull request, tests will be run against all browsers that localForage supports on Travis CI using Sauce Labs.

Library Size

As of version 1.7.3 the payload added to your app is rather small. Served using gzip compression, localForage will add less than 10k to your total bundle size:

minified
`~29kB`
gzipped
`~8.8kB`
brotli'd
`~7.8kB`

License

This program is free software; it is distributed under an Apache License.


Copyright (c) 2013-2016 Mozilla (Contributors).

localForage/localForage

{
"props": {
"initialPayload": {
"allShortcutsEnabled": false,
"path": "/",
"repo": {
"id": 14003349,
"defaultBranch": "master",
"name": "localForage",
"ownerLogin": "localForage",
"currentUserCanPush": false,
"isFork": false,
"isEmpty": false,
"createdAt": "2013-10-31T00:10:06.000Z",
"ownerAvatar": "https://avatars.githubusercontent.com/u/18673496?v=4",
"public": true,
"private": false,
"isOrgOwned": true
},
"currentUser": null,
"refInfo": {
"name": "master",
"listCacheKey": "v0:1629321724.8857348",
"canEdit": false,
"refType": "branch",
"currentOid": "c5b66157252988dc4e74a3eab5226b59be376a2f"
},
"tree": {
"items": [
{
"name": "dist",
"path": "dist",
"contentType": "directory"
},
{
"name": "docs",
"path": "docs",
"contentType": "directory"
},
{
"name": "examples",
"path": "examples",
"contentType": "directory"
},
{
"name": "src",
"path": "src",
"contentType": "directory"
},
{
"name": "test",
"path": "test",
"contentType": "directory"
},
{
"name": "typing-tests",
"path": "typing-tests",
"contentType": "directory"
},
{
"name": "typings",
"path": "typings",
"contentType": "directory"
},
{
"name": ".babelrc",
"path": ".babelrc",
"contentType": "file"
},
{
"name": ".babelrc-umd",
"path": ".babelrc-umd",
"contentType": "file"
},
{
"name": ".eslintrc",
"path": ".eslintrc",
"contentType": "file"
},
{
"name": ".gitignore",
"path": ".gitignore",
"contentType": "file"
},
{
"name": ".huskyrc",
"path": ".huskyrc",
"contentType": "file"
},
{
"name": ".lintstagedrc",
"path": ".lintstagedrc",
"contentType": "file"
},
{
"name": ".npmignore",
"path": ".npmignore",
"contentType": "file"
},
{
"name": ".npmrc",
"path": ".npmrc",
"contentType": "file"
},
{
"name": ".prettierrc",
"path": ".prettierrc",
"contentType": "file"
},
{
"name": ".travis.yml",
"path": ".travis.yml",
"contentType": "file"
},
{
"name": "CHANGELOG.md",
"path": "CHANGELOG.md",
"contentType": "file"
},
{
"name": "CONTRIBUTING.md",
"path": "CONTRIBUTING.md",
"contentType": "file"
},
{
"name": "Gruntfile.js",
"path": "Gruntfile.js",
"contentType": "file"
},
{
"name": "LICENSE",
"path": "LICENSE",
"contentType": "file"
},
{
"name": "README.md",
"path": "README.md",
"contentType": "file"
},
{
"name": "bower.json",
"path": "bower.json",
"contentType": "file"
},
{
"name": "component.json",
"path": "component.json",
"contentType": "file"
},
{
"name": "contribute.json",
"path": "contribute.json",
"contentType": "file"
},
{
"name": "package.json",
"path": "package.json",
"contentType": "file"
}
],
"templateDirectorySuggestionUrl": null,
"readme": null,
"totalCount": 26,
"showBranchInfobar": false
},
"fileTree": null,
"fileTreeProcessingTime": null,
"foldersToFetch": [],
"treeExpanded": false,
"symbolsExpanded": false,
"isOverview": true,
"overview": {
"banners": {
"shouldRecommendReadme": false,
"isPersonalRepo": false,
"showUseActionBanner": false,
"actionSlug": null,
"actionId": null,
"showProtectBranchBanner": false,
"recentlyTouchedDataChannel": null,
"publishBannersInfo": {
"dismissActionNoticePath": "/settings/dismiss-notice/publish_action_from_repo",
"releasePath": "/localForage/localForage/releases/new?marketplace=true",
"showPublishActionBanner": false
},
"interactionLimitBanner": null,
"showInvitationBanner": false,
"inviterName": null
},
"codeButton": {
"contactPath": "/contact",
"isEnterprise": false,
"local": {
"protocolInfo": {
"httpAvailable": true,
"sshAvailable": null,
"httpUrl": "https://github.com/localForage/localForage.git",
"showCloneWarning": null,
"sshUrl": null,
"sshCertificatesRequired": null,
"sshCertificatesAvailable": null,
"ghCliUrl": "gh repo clone localForage/localForage",
"defaultProtocol": "http",
"newSshKeyUrl": "/settings/ssh/new",
"setProtocolPath": "/users/set_protocol"
},
"platformInfo": {
"cloneUrl": "https://desktop.github.com",
"showVisualStudioCloneButton": false,
"visualStudioCloneUrl": "https://windows.github.com",
"showXcodeCloneButton": false,
"xcodeCloneUrl": "https://developer.apple.com",
"zipballUrl": "/localForage/localForage/archive/refs/heads/master.zip"
}
},
"newCodespacePath": "/codespaces/new?hide_repo_select=true&repo=14003349"
},
"popovers": {
"rename": null,
"renamedParentRepo": null
},
"commitCount": "1,124",
"overviewFiles": [
{
"displayName": "README.md",
"repoName": "localForage",
"refName": "master",
"path": "README.md",
"preferredFileType": "readme",
"tabName": "README",
"richText": "<article class=\"markdown-body entry-content container-lg\" itemprop=\"text\"><h1 tabindex=\"-1\" dir=\"auto\"><a id=\"user-content-localforage\" class=\"anchor\" aria-hidden=\"true\" tabindex=\"-1\" href=\"#localforage\"><svg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"><path d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"></path></svg></a>localForage</h1>\n<p dir=\"auto\"><a href=\"http://badge.fury.io/js/localforage\" rel=\"nofollow\"><img src=\"https://camo.githubusercontent.com/514b15c454eeb7f392e0c8b7f73420f3c37c30ccd2cb10664461e861bfefb964/68747470733a2f2f62616467652e667572792e696f2f6a732f6c6f63616c666f726167652e737667\" alt=\"NPM version\" data-canonical-src=\"https://badge.fury.io/js/localforage.svg\" style=\"max-width: 100%;\"></a>\n<a href=\"https://npmcharts.com/compare/localforage?minimal=true\" rel=\"nofollow\"><img src=\"https://camo.githubusercontent.com/923a73a14b3a5f3a7c7d9c9cac445d880fe063cbb09484303d9120e0bd27824d/68747470733a2f2f696d672e736869656c64732e696f2f6e706d2f646d2f6c6f63616c666f726167652e7376673f6d61784167653d32353932303030\" alt=\"npm\" data-canonical-src=\"https://img.shields.io/npm/dm/localforage.svg?maxAge=2592000\" style=\"max-width: 100%;\"></a>\n<a href=\"https://www.jsdelivr.com/package/npm/localforage\" rel=\"nofollow\"><img src=\"https://camo.githubusercontent.com/807c1b9c6315c5a420ba2e8d2858c51aa48cad2611368c86d1c54fedc7a3570e/68747470733a2f2f646174612e6a7364656c6976722e636f6d2f76312f7061636b6167652f6e706d2f6c6f63616c666f726167652f62616467653f7374796c653d726f756e646564\" alt=\"jsDelivr Hits\" data-canonical-src=\"https://data.jsdelivr.com/v1/package/npm/localforage/badge?style=rounded\" style=\"max-width: 100%;\"></a>\n<a href=\"https://bundlephobia.com/[email protected]\" rel=\"nofollow\"><img src=\"https://camo.githubusercontent.com/d40351a279c55046e5cb316e5cbeee4945c70dd2bed0a3224feaf89be8a0d0af/68747470733a2f2f62616467656e2e6e65742f62756e646c6570686f6269612f6d696e7a69702f6c6f63616c666f72616765\" alt=\"minzipped size\" data-canonical-src=\"https://badgen.net/bundlephobia/minzip/localforage\" style=\"max-width: 100%;\"></a></p>\n<p dir=\"auto\">localForage is a fast and simple storage library for JavaScript. localForage\nimproves the offline experience of your web app by using asynchronous storage\n(IndexedDB or WebSQL) with a simple, <code>localStorage</code>-like API.</p>\n<p dir=\"auto\">localForage uses localStorage in browsers with no IndexedDB or\nWebSQL support. See <a href=\"https://github.com/localForage/localForage/wiki/Supported-Browsers-Platforms\">the wiki for detailed compatibility info</a>.</p>\n<p dir=\"auto\">To use localForage, just drop a single JavaScript file into your page:</p>\n<div class=\"highlight highlight-text-html-basic notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"&lt;script src=&quot;localforage/dist/localforage.js&quot;&gt;&lt;/script&gt;\n&lt;script&gt;localforage.getItem('something', myCallback);&lt;/script&gt;\"><pre><span class=\"pl-kos\">&lt;</span><span class=\"pl-ent\">script</span> <span class=\"pl-c1\">src</span>=\"<span class=\"pl-s\">localforage/dist/localforage.js</span>\"<span class=\"pl-kos\">&gt;</span><span class=\"pl-kos\">&lt;/</span><span class=\"pl-ent\">script</span><span class=\"pl-kos\">&gt;</span>\n<span class=\"pl-kos\">&lt;</span><span class=\"pl-ent\">script</span><span class=\"pl-kos\">&gt;</span><span class=\"pl-s1\">localforage</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">getItem</span><span class=\"pl-kos\">(</span><span class=\"pl-s\">'something'</span><span class=\"pl-kos\">,</span> <span class=\"pl-s1\">myCallback</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">;</span><span class=\"pl-kos\">&lt;/</span><span class=\"pl-ent\">script</span><span class=\"pl-kos\">&gt;</span></pre></div>\n<p dir=\"auto\">Try the <a href=\"http://codepen.io/thgreasi/pen/ojYKeE\" rel=\"nofollow\">live example</a>.</p>\n<p dir=\"auto\">Download the <a href=\"https://github.com/localForage/localForage/releases/latest\">latest localForage from GitHub</a>, or install with\n<a href=\"https://www.npmjs.com/\" rel=\"nofollow\">npm</a>:</p>\n<div class=\"highlight highlight-source-shell notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"npm install localforage\"><pre>npm install localforage</pre></div>\n<h2 tabindex=\"-1\" dir=\"auto\"><a id=\"user-content-support\" class=\"anchor\" aria-hidden=\"true\" tabindex=\"-1\" href=\"#support\"><svg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"><path d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"></path></svg></a>Support</h2>\n<p dir=\"auto\">Lost? Need help? Try the\n<a href=\"https://localforage.github.io/localForage\" rel=\"nofollow\">localForage API documentation</a>. <a href=\"https://localforage.docschina.org\" rel=\"nofollow\">localForage API文档也有中文版。</a></p>\n<p dir=\"auto\">If you're having trouble using the library, running the tests, or want to contribute to localForage, please look through the <a href=\"https://github.com/localForage/localForage/issues\">existing issues</a> for your problem first before creating a new one. If you still need help, <a href=\"https://github.com/localForage/localForage/issues/new\">feel free to file an issue</a>.</p>\n<h1 tabindex=\"-1\" dir=\"auto\"><a id=\"user-content-how-to-use-localforage\" class=\"anchor\" aria-hidden=\"true\" tabindex=\"-1\" href=\"#how-to-use-localforage\"><svg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"><path d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"></path></svg></a>How to use localForage</h1>\n<h2 tabindex=\"-1\" dir=\"auto\"><a id=\"user-content-callbacks-vs-promises\" class=\"anchor\" aria-hidden=\"true\" tabindex=\"-1\" href=\"#callbacks-vs-promises\"><svg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"><path d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"></path></svg></a>Callbacks vs Promises</h2>\n<p dir=\"auto\">Because localForage uses async storage, it has an async API.\nIt's otherwise exactly the same as the\n<a href=\"https://hacks.mozilla.org/2009/06/localstorage/\" rel=\"nofollow\">localStorage API</a>.</p>\n<p dir=\"auto\">localForage has a dual API that allows you to either use Node-style callbacks\nor <a href=\"https://www.promisejs.org/\" rel=\"nofollow\">Promises</a>. If you are unsure which one is right for you, it's recommended to use Promises.</p>\n<p dir=\"auto\">Here's an example of the Node-style callback form:</p>\n<div class=\"highlight highlight-source-js notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"localforage.setItem('key', 'value', function (err) {\n // if err is non-null, we got an error\n localforage.getItem('key', function (err, value) {\n // if err is non-null, we got an error. otherwise, value is the value\n });\n});\"><pre><span class=\"pl-s1\">localforage</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">setItem</span><span class=\"pl-kos\">(</span><span class=\"pl-s\">'key'</span><span class=\"pl-kos\">,</span> <span class=\"pl-s\">'value'</span><span class=\"pl-kos\">,</span> <span class=\"pl-k\">function</span> <span class=\"pl-kos\">(</span><span class=\"pl-s1\">err</span><span class=\"pl-kos\">)</span> <span class=\"pl-kos\">{</span>\n <span class=\"pl-c\">// if err is non-null, we got an error</span>\n <span class=\"pl-s1\">localforage</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">getItem</span><span class=\"pl-kos\">(</span><span class=\"pl-s\">'key'</span><span class=\"pl-kos\">,</span> <span class=\"pl-k\">function</span> <span class=\"pl-kos\">(</span><span class=\"pl-s1\">err</span><span class=\"pl-kos\">,</span> <span class=\"pl-s1\">value</span><span class=\"pl-kos\">)</span> <span class=\"pl-kos\">{</span>\n <span class=\"pl-c\">// if err is non-null, we got an error. otherwise, value is the value</span>\n <span class=\"pl-kos\">}</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">;</span>\n<span class=\"pl-kos\">}</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">;</span></pre></div>\n<p dir=\"auto\">And the Promise form:</p>\n<div class=\"highlight highlight-source-js notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"localforage.setItem('key', 'value').then(function () {\n return localforage.getItem('key');\n}).then(function (value) {\n // we got our value\n}).catch(function (err) {\n // we got an error\n});\"><pre><span class=\"pl-s1\">localforage</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">setItem</span><span class=\"pl-kos\">(</span><span class=\"pl-s\">'key'</span><span class=\"pl-kos\">,</span> <span class=\"pl-s\">'value'</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">then</span><span class=\"pl-kos\">(</span><span class=\"pl-k\">function</span> <span class=\"pl-kos\">(</span><span class=\"pl-kos\">)</span> <span class=\"pl-kos\">{</span>\n <span class=\"pl-k\">return</span> <span class=\"pl-s1\">localforage</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">getItem</span><span class=\"pl-kos\">(</span><span class=\"pl-s\">'key'</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">;</span>\n<span class=\"pl-kos\">}</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">then</span><span class=\"pl-kos\">(</span><span class=\"pl-k\">function</span> <span class=\"pl-kos\">(</span><span class=\"pl-s1\">value</span><span class=\"pl-kos\">)</span> <span class=\"pl-kos\">{</span>\n <span class=\"pl-c\">// we got our value</span>\n<span class=\"pl-kos\">}</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">catch</span><span class=\"pl-kos\">(</span><span class=\"pl-k\">function</span> <span class=\"pl-kos\">(</span><span class=\"pl-s1\">err</span><span class=\"pl-kos\">)</span> <span class=\"pl-kos\">{</span>\n <span class=\"pl-c\">// we got an error</span>\n<span class=\"pl-kos\">}</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">;</span></pre></div>\n<p dir=\"auto\">Or, use <code>async</code>/<code>await</code>:</p>\n<div class=\"highlight highlight-source-js notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"try {\n const value = await localforage.getItem('somekey');\n // This code runs once the value has been loaded\n // from the offline store.\n console.log(value);\n} catch (err) {\n // This code runs if there were any errors.\n console.log(err);\n}\"><pre><span class=\"pl-k\">try</span> <span class=\"pl-kos\">{</span>\n <span class=\"pl-k\">const</span> <span class=\"pl-s1\">value</span> <span class=\"pl-c1\">=</span> <span class=\"pl-k\">await</span> <span class=\"pl-s1\">localforage</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">getItem</span><span class=\"pl-kos\">(</span><span class=\"pl-s\">'somekey'</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">;</span>\n <span class=\"pl-c\">// This code runs once the value has been loaded</span>\n <span class=\"pl-c\">// from the offline store.</span>\n <span class=\"pl-smi\">console</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">log</span><span class=\"pl-kos\">(</span><span class=\"pl-s1\">value</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">;</span>\n<span class=\"pl-kos\">}</span> <span class=\"pl-k\">catch</span> <span class=\"pl-kos\">(</span><span class=\"pl-s1\">err</span><span class=\"pl-kos\">)</span> <span class=\"pl-kos\">{</span>\n <span class=\"pl-c\">// This code runs if there were any errors.</span>\n <span class=\"pl-smi\">console</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">log</span><span class=\"pl-kos\">(</span><span class=\"pl-s1\">err</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">;</span>\n<span class=\"pl-kos\">}</span></pre></div>\n<p dir=\"auto\">For more examples, please visit <a href=\"https://localforage.github.io/localForage\" rel=\"nofollow\">the API docs</a>.</p>\n<h2 tabindex=\"-1\" dir=\"auto\"><a id=\"user-content-storing-blobs-typedarrays-and-other-js-objects\" class=\"anchor\" aria-hidden=\"true\" tabindex=\"-1\" href=\"#storing-blobs-typedarrays-and-other-js-objects\"><svg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"><path d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"></path></svg></a>Storing Blobs, TypedArrays, and other JS objects</h2>\n<p dir=\"auto\">You can store any type in localForage; you aren't limited to strings like in\nlocalStorage. Even if localStorage is your storage backend, localForage\nautomatically does <code>JSON.parse()</code> and <code>JSON.stringify()</code> when getting/setting\nvalues.</p>\n<p dir=\"auto\">localForage supports storing all native JS objects that can be serialized to\nJSON, as well as ArrayBuffers, Blobs, and TypedArrays. Check the\n<a href=\"https://localforage.github.io/localForage/#data-api-setitem\" rel=\"nofollow\">API docs</a> for a full list of types supported by localForage.</p>\n<p dir=\"auto\">All types are supported in every storage backend, though storage limits in\nlocalStorage make storing many large Blobs impossible.</p>\n<h2 tabindex=\"-1\" dir=\"auto\"><a id=\"user-content-configuration\" class=\"anchor\" aria-hidden=\"true\" tabindex=\"-1\" href=\"#configuration\"><svg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"><path d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"></path></svg></a>Configuration</h2>\n<p dir=\"auto\">You can set database information with the <code>config()</code> method.\nAvailable options are <code>driver</code>, <code>name</code>, <code>storeName</code>, <code>version</code>, <code>size</code>, and\n<code>description</code>.</p>\n<p dir=\"auto\">Example:</p>\n<div class=\"highlight highlight-source-js notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"localforage.config({\n driver : localforage.WEBSQL, // Force WebSQL; same as using setDriver()\n name : 'myApp',\n version : 1.0,\n size : 4980736, // Size of database, in bytes. WebSQL-only for now.\n storeName : 'keyvaluepairs', // Should be alphanumeric, with underscores.\n description : 'some description'\n});\"><pre><span class=\"pl-s1\">localforage</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">config</span><span class=\"pl-kos\">(</span><span class=\"pl-kos\">{</span>\n <span class=\"pl-c1\">driver</span> : <span class=\"pl-s1\">localforage</span><span class=\"pl-kos\">.</span><span class=\"pl-c1\">WEBSQL</span><span class=\"pl-kos\">,</span> <span class=\"pl-c\">// Force WebSQL; same as using setDriver()</span>\n <span class=\"pl-c1\">name</span> : <span class=\"pl-s\">'myApp'</span><span class=\"pl-kos\">,</span>\n <span class=\"pl-c1\">version</span> : <span class=\"pl-c1\">1.0</span><span class=\"pl-kos\">,</span>\n <span class=\"pl-c1\">size</span> : <span class=\"pl-c1\">4980736</span><span class=\"pl-kos\">,</span> <span class=\"pl-c\">// Size of database, in bytes. WebSQL-only for now.</span>\n <span class=\"pl-c1\">storeName</span> : <span class=\"pl-s\">'keyvaluepairs'</span><span class=\"pl-kos\">,</span> <span class=\"pl-c\">// Should be alphanumeric, with underscores.</span>\n <span class=\"pl-c1\">description</span> : <span class=\"pl-s\">'some description'</span>\n<span class=\"pl-kos\">}</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">;</span></pre></div>\n<p dir=\"auto\"><strong>Note:</strong> you must call <code>config()</code> <em>before</em> you interact with your data. This\nmeans calling <code>config()</code> before using <code>getItem()</code>, <code>setItem()</code>, <code>removeItem()</code>,\n<code>clear()</code>, <code>key()</code>, <code>keys()</code> or <code>length()</code>.</p>\n<h2 tabindex=\"-1\" dir=\"auto\"><a id=\"user-content-multiple-instances\" class=\"anchor\" aria-hidden=\"true\" tabindex=\"-1\" href=\"#multiple-instances\"><svg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"><path d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"></path></svg></a>Multiple instances</h2>\n<p dir=\"auto\">You can create multiple instances of localForage that point to different stores\nusing <code>createInstance</code>. All the configuration options used by\n<a href=\"#configuration\"><code>config</code></a> are supported.</p>\n<div class=\"highlight highlight-source-js notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"var store = localforage.createInstance({\n name: &quot;nameHere&quot;\n});\n\nvar otherStore = localforage.createInstance({\n name: &quot;otherName&quot;\n});\n\n// Setting the key on one of these doesn't affect the other.\nstore.setItem(&quot;key&quot;, &quot;value&quot;);\notherStore.setItem(&quot;key&quot;, &quot;value2&quot;);\"><pre><span class=\"pl-k\">var</span> <span class=\"pl-s1\">store</span> <span class=\"pl-c1\">=</span> <span class=\"pl-s1\">localforage</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">createInstance</span><span class=\"pl-kos\">(</span><span class=\"pl-kos\">{</span>\n <span class=\"pl-c1\">name</span>: <span class=\"pl-s\">\"nameHere\"</span>\n<span class=\"pl-kos\">}</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">;</span>\n\n<span class=\"pl-k\">var</span> <span class=\"pl-s1\">otherStore</span> <span class=\"pl-c1\">=</span> <span class=\"pl-s1\">localforage</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">createInstance</span><span class=\"pl-kos\">(</span><span class=\"pl-kos\">{</span>\n <span class=\"pl-c1\">name</span>: <span class=\"pl-s\">\"otherName\"</span>\n<span class=\"pl-kos\">}</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">;</span>\n\n<span class=\"pl-c\">// Setting the key on one of these doesn't affect the other.</span>\n<span class=\"pl-s1\">store</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">setItem</span><span class=\"pl-kos\">(</span><span class=\"pl-s\">\"key\"</span><span class=\"pl-kos\">,</span> <span class=\"pl-s\">\"value\"</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">;</span>\n<span class=\"pl-s1\">otherStore</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">setItem</span><span class=\"pl-kos\">(</span><span class=\"pl-s\">\"key\"</span><span class=\"pl-kos\">,</span> <span class=\"pl-s\">\"value2\"</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">;</span></pre></div>\n<h2 tabindex=\"-1\" dir=\"auto\"><a id=\"user-content-requirejs\" class=\"anchor\" aria-hidden=\"true\" tabindex=\"-1\" href=\"#requirejs\"><svg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"><path d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"></path></svg></a>RequireJS</h2>\n<p dir=\"auto\">You can use localForage with <a href=\"http://requirejs.org/\" rel=\"nofollow\">RequireJS</a>:</p>\n<div class=\"highlight highlight-source-js notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"define(['localforage'], function(localforage) {\n // As a callback:\n localforage.setItem('mykey', 'myvalue', console.log);\n\n // With a Promise:\n localforage.setItem('mykey', 'myvalue').then(console.log);\n});\"><pre><span class=\"pl-en\">define</span><span class=\"pl-kos\">(</span><span class=\"pl-kos\">[</span><span class=\"pl-s\">'localforage'</span><span class=\"pl-kos\">]</span><span class=\"pl-kos\">,</span> <span class=\"pl-k\">function</span><span class=\"pl-kos\">(</span><span class=\"pl-s1\">localforage</span><span class=\"pl-kos\">)</span> <span class=\"pl-kos\">{</span>\n <span class=\"pl-c\">// As a callback:</span>\n <span class=\"pl-s1\">localforage</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">setItem</span><span class=\"pl-kos\">(</span><span class=\"pl-s\">'mykey'</span><span class=\"pl-kos\">,</span> <span class=\"pl-s\">'myvalue'</span><span class=\"pl-kos\">,</span> <span class=\"pl-smi\">console</span><span class=\"pl-kos\">.</span><span class=\"pl-c1\">log</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">;</span>\n\n <span class=\"pl-c\">// With a Promise:</span>\n <span class=\"pl-s1\">localforage</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">setItem</span><span class=\"pl-kos\">(</span><span class=\"pl-s\">'mykey'</span><span class=\"pl-kos\">,</span> <span class=\"pl-s\">'myvalue'</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">.</span><span class=\"pl-en\">then</span><span class=\"pl-kos\">(</span><span class=\"pl-smi\">console</span><span class=\"pl-kos\">.</span><span class=\"pl-c1\">log</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">;</span>\n<span class=\"pl-kos\">}</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">;</span></pre></div>\n<h2 tabindex=\"-1\" dir=\"auto\"><a id=\"user-content-typescript\" class=\"anchor\" aria-hidden=\"true\" tabindex=\"-1\" href=\"#typescript\"><svg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"><path d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"></path></svg></a>TypeScript</h2>\n<p dir=\"auto\">If you have the <a href=\"https://www.typescriptlang.org/docs/handbook/compiler-options.html\" rel=\"nofollow\"><code>allowSyntheticDefaultImports</code> compiler option</a> set to <code>true</code> in your <a href=\"https://www.typescriptlang.org/docs/handbook/tsconfig-json.html\" rel=\"nofollow\">tsconfig.json</a> (supported in TypeScript v1.8+), you should use:</p>\n<div class=\"highlight highlight-source-js notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"import localForage from &quot;localforage&quot;;\"><pre><span class=\"pl-k\">import</span> <span class=\"pl-s1\">localForage</span> <span class=\"pl-k\">from</span> <span class=\"pl-s\">\"localforage\"</span><span class=\"pl-kos\">;</span></pre></div>\n<p dir=\"auto\">Otherwise you should use one of the following:</p>\n<div class=\"highlight highlight-source-js notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"import * as localForage from &quot;localforage&quot;;\n// or, in case that the typescript version that you are using\n// doesn't support ES6 style imports for UMD modules like localForage\nimport localForage = require(&quot;localforage&quot;);\"><pre><span class=\"pl-k\">import</span> <span class=\"pl-c1\">*</span> <span class=\"pl-k\">as</span> <span class=\"pl-s1\">localForage</span> <span class=\"pl-k\">from</span> <span class=\"pl-s\">\"localforage\"</span><span class=\"pl-kos\">;</span>\n<span class=\"pl-c\">// or, in case that the typescript version that you are using</span>\n<span class=\"pl-c\">// doesn't support ES6 style imports for UMD modules like localForage</span>\n<span class=\"pl-k\">import</span> <span class=\"pl-s1\">localForage</span> <span class=\"pl-c1\">=</span> <span class=\"pl-en\">require</span><span class=\"pl-kos\">(</span><span class=\"pl-s\">\"localforage\"</span><span class=\"pl-kos\">)</span><span class=\"pl-kos\">;</span></pre></div>\n<h2 tabindex=\"-1\" dir=\"auto\"><a id=\"user-content-framework-support\" class=\"anchor\" aria-hidden=\"true\" tabindex=\"-1\" href=\"#framework-support\"><svg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"><path d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"></path></svg></a>Framework Support</h2>\n<p dir=\"auto\">If you use a framework listed, there's a localForage storage driver for the\nmodels in your framework so you can store data offline with localForage. We\nhave drivers for the following frameworks:</p>\n<ul dir=\"auto\">\n<li><a href=\"https://github.com/ocombe/angular-localForage\">AngularJS</a></li>\n<li><a href=\"https://github.com/Alorel/ngforage/\">Angular 4 and up</a></li>\n<li><a href=\"https://github.com/localForage/localForage-backbone\">Backbone</a></li>\n<li><a href=\"https://github.com/genkgo/ember-localforage-adapter\">Ember</a></li>\n<li><a href=\"https://github.com/dmlzj/vlf\">Vue</a></li>\n<li><a href=\"https://github.com/nuxt-community/localforage-module\">NuxtJS</a></li>\n</ul>\n<p dir=\"auto\">If you have a driver you'd like listed, please\n<a href=\"https://github.com/localForage/localForage/issues/new\">open an issue</a> to have it\nadded to this list.</p>\n<h2 tabindex=\"-1\" dir=\"auto\"><a id=\"user-content-custom-drivers\" class=\"anchor\" aria-hidden=\"true\" tabindex=\"-1\" href=\"#custom-drivers\"><svg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"><path d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"></path></svg></a>Custom Drivers</h2>\n<p dir=\"auto\">You can create your own driver if you want; see the\n<a href=\"https://localforage.github.io/localForage/#driver-api-definedriver\" rel=\"nofollow\"><code>defineDriver</code></a> API docs.</p>\n<p dir=\"auto\">There is a <a href=\"https://github.com/localForage/localForage/wiki/Custom-Drivers\">list of custom drivers on the wiki</a>.</p>\n<h1 tabindex=\"-1\" dir=\"auto\"><a id=\"user-content-working-on-localforage\" class=\"anchor\" aria-hidden=\"true\" tabindex=\"-1\" href=\"#working-on-localforage\"><svg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"><path d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"></path></svg></a>Working on localForage</h1>\n<p dir=\"auto\">You'll need <a href=\"http://nodejs.org/\" rel=\"nofollow\">node/npm</a> and\n<a href=\"http://bower.io/#installing-bower\" rel=\"nofollow\">bower</a>.</p>\n<p dir=\"auto\">To work on localForage, you should start by\n<a href=\"https://github.com/localForage/localForage/fork\">forking it</a> and installing its\ndependencies. Replace <code>USERNAME</code> with your GitHub username and run the\nfollowing:</p>\n<div class=\"highlight highlight-source-shell notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"# Install bower globally if you don't have it:\nnpm install -g bower\n\n# Replace USERNAME with your GitHub username:\ngit clone [email protected]:USERNAME/localForage.git\ncd localForage\nnpm install\nbower install\"><pre><span class=\"pl-c\"><span class=\"pl-c\">#</span> Install bower globally if you don't have it:</span>\nnpm install -g bower\n\n<span class=\"pl-c\"><span class=\"pl-c\">#</span> Replace USERNAME with your GitHub username:</span>\ngit clone [email protected]:USERNAME/localForage.git\n<span class=\"pl-c1\">cd</span> localForage\nnpm install\nbower install</pre></div>\n<p dir=\"auto\">Omitting the bower dependencies will cause the tests to fail!</p>\n<h2 tabindex=\"-1\" dir=\"auto\"><a id=\"user-content-running-tests\" class=\"anchor\" aria-hidden=\"true\" tabindex=\"-1\" href=\"#running-tests\"><svg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"><path d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"></path></svg></a>Running Tests</h2>\n<p dir=\"auto\">You need PhantomJS installed to run local tests. Run <code>npm test</code> (or,\ndirectly: <code>grunt test</code>). Your code must also pass the\n<a href=\"http://jshint.com/\" rel=\"nofollow\">linter</a>.</p>\n<p dir=\"auto\">localForage is designed to run in the browser, so the tests explicitly require\na browser environment. Local tests are run on a headless WebKit (using\n<a href=\"http://phantomjs.org\" rel=\"nofollow\">PhantomJS</a>).</p>\n<p dir=\"auto\">When you submit a pull request, tests will be run against all browsers that\nlocalForage supports on Travis CI using <a href=\"https://saucelabs.com/\" rel=\"nofollow\">Sauce Labs</a>.</p>\n<h2 tabindex=\"-1\" dir=\"auto\"><a id=\"user-content-library-size\" class=\"anchor\" aria-hidden=\"true\" tabindex=\"-1\" href=\"#library-size\"><svg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"><path d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"></path></svg></a>Library Size</h2>\n<p dir=\"auto\">As of version 1.7.3 the payload added to your app is rather small. Served using gzip compression, localForage will add less than 10k to your total bundle size:</p>\n<dl>\n <dt>minified</dt><dd>`~29kB`</dd>\n <dt>gzipped</dt><dd>`~8.8kB`</dd>\n <dt>brotli'd</dt><dd>`~7.8kB`</dd>\n</dl>\n<h1 tabindex=\"-1\" dir=\"auto\"><a id=\"user-content-license\" class=\"anchor\" aria-hidden=\"true\" tabindex=\"-1\" href=\"#license\"><svg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"><path d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"></path></svg></a>License</h1>\n<p dir=\"auto\">This program is free software; it is distributed under an\n<a href=\"https://github.com/localForage/localForage/blob/master/LICENSE\">Apache License</a>.</p>\n<hr>\n<p dir=\"auto\">Copyright (c) 2013-2016 <a href=\"https://mozilla.org\" rel=\"nofollow\">Mozilla</a>\n(<a href=\"https://github.com/localForage/localForage/graphs/contributors\">Contributors</a>).</p>\n</article>",
"loaded": true,
"timedOut": false,
"errorMessage": null,
"headerInfo": {
"toc": [
{
"level": 1,
"text": "localForage",
"anchor": "localforage",
"htmlText": "localForage"
},
{
"level": 2,
"text": "Support",
"anchor": "support",
"htmlText": "Support"
},
{
"level": 1,
"text": "How to use localForage",
"anchor": "how-to-use-localforage",
"htmlText": "How to use localForage"
},
{
"level": 2,
"text": "Callbacks vs Promises",
"anchor": "callbacks-vs-promises",
"htmlText": "Callbacks vs Promises"
},
{
"level": 2,
"text": "Storing Blobs, TypedArrays, and other JS objects",
"anchor": "storing-blobs-typedarrays-and-other-js-objects",
"htmlText": "Storing Blobs, TypedArrays, and other JS objects"
},
{
"level": 2,
"text": "Configuration",
"anchor": "configuration",
"htmlText": "Configuration"
},
{
"level": 2,
"text": "Multiple instances",
"anchor": "multiple-instances",
"htmlText": "Multiple instances"
},
{
"level": 2,
"text": "RequireJS",
"anchor": "requirejs",
"htmlText": "RequireJS"
},
{
"level": 2,
"text": "TypeScript",
"anchor": "typescript",
"htmlText": "TypeScript"
},
{
"level": 2,
"text": "Framework Support",
"anchor": "framework-support",
"htmlText": "Framework Support"
},
{
"level": 2,
"text": "Custom Drivers",
"anchor": "custom-drivers",
"htmlText": "Custom Drivers"
},
{
"level": 1,
"text": "Working on localForage",
"anchor": "working-on-localforage",
"htmlText": "Working on localForage"
},
{
"level": 2,
"text": "Running Tests",
"anchor": "running-tests",
"htmlText": "Running Tests"
},
{
"level": 2,
"text": "Library Size",
"anchor": "library-size",
"htmlText": "Library Size"
},
{
"level": 1,
"text": "License",
"anchor": "license",
"htmlText": "License"
}
],
"siteNavLoginPath": "/login?return_to=https%3A%2F%2Fgithub.com%2FlocalForage%2FlocalForage"
}
},
{
"displayName": "LICENSE",
"repoName": "localForage",
"refName": "master",
"path": "LICENSE",
"preferredFileType": "license",
"tabName": "Apache-2.0",
"richText": null,
"loaded": false,
"timedOut": false,
"errorMessage": null,
"headerInfo": {
"toc": null,
"siteNavLoginPath": "/login?return_to=https%3A%2F%2Fgithub.com%2FlocalForage%2FlocalForage"
}
}
],
"overviewFilesProcessingTime": 16.322012
}
},
"appPayload": {
"helpUrl": "https://docs.github.com",
"findFileWorkerPath": "/assets-cdn/worker/find-file-worker-32bb159cc57c.js",
"findInFileWorkerPath": "/assets-cdn/worker/find-in-file-worker-c6704d501c10.js",
"githubDevUrl": null,
"enabled_features": {
"code_nav_ui_events": false,
"copilot_conversational_ux": false,
"copilot_conversational_ux_embedding_update": false,
"copilot_popover_file_editor_header": false,
"copilot_smell_icebreaker_ux": true,
"copilot_workspace": false,
"codeview_firefox_inert": true
}
}
}
}
{
"accept-ranges": "bytes",
"cache-control": "max-age=0, private, must-revalidate",
"content-encoding": "gzip",
"content-security-policy": "default-src 'none'; base-uri 'self'; child-src github.com/assets-cdn/worker/ gist.github.com/assets-cdn/worker/; connect-src 'self' uploads.github.com www.githubstatus.com collector.github.com raw.githubusercontent.com api.github.com github-cloud.s3.amazonaws.com github-production-repository-file-5c1aeb.s3.amazonaws.com github-production-upload-manifest-file-7fdce7.s3.amazonaws.com github-production-user-asset-6210df.s3.amazonaws.com api.githubcopilot.com objects-origin.githubusercontent.com *.actions.githubusercontent.com wss://*.actions.githubusercontent.com productionresultssa0.blob.core.windows.net/ productionresultssa1.blob.core.windows.net/ productionresultssa2.blob.core.windows.net/ productionresultssa3.blob.core.windows.net/ productionresultssa4.blob.core.windows.net/ productionresultssa5.blob.core.windows.net/ productionresultssa6.blob.core.windows.net/ productionresultssa7.blob.core.windows.net/ productionresultssa8.blob.core.windows.net/ productionresultssa9.blob.core.windows.net/ productionresultssa10.blob.core.windows.net/ productionresultssa11.blob.core.windows.net/ productionresultssa12.blob.core.windows.net/ productionresultssa13.blob.core.windows.net/ productionresultssa14.blob.core.windows.net/ productionresultssa15.blob.core.windows.net/ productionresultssa16.blob.core.windows.net/ productionresultssa17.blob.core.windows.net/ productionresultssa18.blob.core.windows.net/ productionresultssa19.blob.core.windows.net/ github-production-repository-image-32fea6.s3.amazonaws.com github-production-release-asset-2e65be.s3.amazonaws.com insights.github.com wss://alive.github.com; font-src github.githubassets.com; form-action 'self' github.com gist.github.com objects-origin.githubusercontent.com; frame-ancestors 'none'; frame-src viewscreen.githubusercontent.com notebooks.githubusercontent.com; img-src 'self' data: github.githubassets.com media.githubusercontent.com camo.githubusercontent.com identicons.github.com avatars.githubusercontent.com github-cloud.s3.amazonaws.com objects.githubusercontent.com secured-user-images.githubusercontent.com/ user-images.githubusercontent.com/ private-user-images.githubusercontent.com opengraph.githubassets.com github-production-user-asset-6210df.s3.amazonaws.com customer-stories-feed.github.com spotlights-feed.github.com objects-origin.githubusercontent.com *.githubusercontent.com; manifest-src 'self'; media-src github.com user-images.githubusercontent.com/ secured-user-images.githubusercontent.com/ private-user-images.githubusercontent.com github-production-user-asset-6210df.s3.amazonaws.com gist.github.com; script-src github.githubassets.com; style-src 'unsafe-inline' github.githubassets.com; upgrade-insecure-requests; worker-src github.com/assets-cdn/worker/ gist.github.com/assets-cdn/worker/",
"content-type": "text/html; charset=utf-8",
"date": "Mon, 26 Feb 2024 10:52:08 GMT",
"etag": "0b822687ab0cd5fdb41ecba47ebd2fb6",
"referrer-policy": "no-referrer-when-downgrade",
"server": "GitHub.com",
"set-cookie": "logged_in=no; Path=/; Domain=github.com; Expires=Wed, 26 Feb 2025 10:52:07 GMT; HttpOnly; Secure; SameSite=Lax",
"strict-transport-security": "max-age=31536000; includeSubdomains; preload",
"transfer-encoding": "chunked",
"vary": "X-PJAX, X-PJAX-Container, Turbo-Visit, Turbo-Frame, Accept-Encoding, Accept, X-Requested-With",
"x-content-type-options": "nosniff",
"x-frame-options": "deny",
"x-github-request-id": "805E:21134C:1B04C17:2688AF8:65DC6D57",
"x-xss-protection": "0"
}