Installation
Include the script (unless you are packaging scripts somehow else): 地址：https://github.com/js-cookie/js-cookie
Do not include the script directly from GitHub (http://raw.github.com/...). The file is being served as text/plain and as such being blocked in Internet Explorer on Windows 7 for instance (because of the wrong MIME type). Bottom line: GitHub is not a CDN.
js-cookie supports npm and Bower under the name js-cookie
It can also be loaded as an AMD or CommonJS module.
Basic Usage
Create a cookie, valid across the entire site:
Cookies.set('name', 'value');
Create a cookie that expires 7 days from now, valid across the entire site:
Cookies.set('name', 'value', { expires: 7 });
Create an expiring cookie, valid to the path of the current page:
Cookies.set('name', 'value', { expires: 7, path: '' });
Read cookie:
Cookies.get('name'); // => 'value'Cookies.get('nothing'); // => undefined
Read all visible cookies:
Cookies.get(); // => { name: 'value' }
Delete cookie:
Cookies.remove('name');
Delete a cookie valid to the path of the current page:
Cookies.set('name', 'value', { path: '' });
Cookies.remove('name'); // fail!Cookies.remove('name', { path: '' }); // removed!
IMPORTANT! when deleting a cookie, you must pass the exact same path, domain and secure attributes that were used to set the cookie, unless you're relying on the default attributes.
Namespace conflicts
If there is any danger of a conflict with the namespace Cookies, the noConflict method will allow you to define a new namespace and preserve the original one. This is especially useful when running the script on third party sites e.g. as part of a widget or SDK.
// Assign the js-cookie api to a different variable and restore the original "window.Cookies"var Cookies2 = Cookies.noConflict();
Cookies2.set('name', 'value');
Note: The .noConflict method is not necessary when using AMD or CommonJS, thus it is not exposed in those environments.
JSON
js-cookie provides unobstrusive JSON storage for cookies.
When creating a cookie you can pass an Array or Object Literal instead of a string in the value. If you do so, js-cookie will store the string representation of the object according to JSON.stringify:
Cookies.set('name', { foo: 'bar' });
When reading a cookie with the default Cookies.get api, you receive the string representation stored in the cookie:
Cookies.get('name'); // => '{"foo":"bar"}'
Cookies.get(); // => { name: '{"foo":"bar"}' }
When reading a cookie with the Cookies.getJSON api, you receive the parsed representation of the string stored in the cookie according to JSON.parse:
Cookies.getJSON('name'); // => { foo: 'bar' }
Cookies.getJSON(); // => { name: { foo: 'bar' } }
Note: To support IE6-7 (and IE 8 compatibility mode) you need to include the JSON-js polyfill:https://github.com/douglascrockford/JSON-js
Encoding
This project is RFC 6265 compliant. All special characters that are not allowed in the cookie-name or cookie-value are encoded with each one's UTF-8 Hex equivalent using percent-encoding.
The only character in cookie-name or cookie-value that is allowed and still encoded is the percent %character, it is escaped in order to interpret percent input as literal.
To override the default cookie decoding you need to use a converter.
Cookie Attributes
Cookie attributes defaults can be set globally by setting properties of the Cookies.defaults object or individually for each call to Cookies.set(...) by passing a plain object in the last argument. Per-call attributes override the default attributes.
expires
Define when the cookie will be removed. Value can be a Number which will be interpreted as days from time of creation or a Date instance. If omitted, the cookie becomes a session cookie.
Default: Cookie is removed when the user closes the browser.
Examples:
Cookies.set('name', 'value', { expires: 365 });
Cookies.get('name'); // => 'value'Cookies.remove('name');
path
A String indicating the path where the cookie is visible.
Default: /
Examples:
Cookies.set('name', 'value', { path: '' });
Cookies.get('name'); // => 'value'Cookies.remove('name', { path: '' });
Note regarding Internet Explorer:
Due to an obscure bug in the underlying WinINET InternetGetCookie implementation, IE’s document.cookie will not return a cookie if it was set with a path attribute containing a filename.
(From Internet Explorer Cookie Internals (FAQ))
This means one cannot set a path using path: window.location.pathname in case such pathname contains a filename like so: /check.html (or at least, such cookie cannot be read correctly).
domain
A String indicating a valid domain where the cookie is visible.
Default: Domain of the page where the cookie was created.
Examples:
Cookies.set('name', 'value', { domain: 'sub.domain.com' });
Cookies.get('name'); // => undefined (need to read at 'sub.domain.com')
secure
Either true or false, indicating if the cookie transmission requires a secure protocol (https).
Default: No secure protocol requirement.
Examples:
Cookies.set('name', 'value', { secure: true });
Cookies.get('name'); // => 'value'Cookies.remove('name', { secure: true });
Converter
Create a new instance of the api that overrides the default decoding implementation.
All get methods that rely in a proper decoding to work, such as Cookies.get() andCookies.get('name'), will run the converter first for each cookie.
The returning String will be used as the cookie value.
Example from reading one of the cookies that can only be decoded using the escape function:
document.cookie = 'escaped=%u5317';document.cookie = 'default=%E5%8C%97';var cookies = Cookies.withConverter(function (value, name) { if ( name === 'escaped' ) { return unescape(value);
}
});
cookies.get('escaped'); // 北cookies.get('default'); // 北cookies.get(); // { escaped: '北', default: '北' }
Example for parsing the value from a cookie generated with PHP's setcookie() method:
// 'cookie+with+space' => 'cookie with space'Cookies.withConverter(function (value) { return value.replace(/+/g, ' ');
}).get('foo');
