This article mainly introduces cookie encapsulation and Usage Guide made by javascript. For more information, see section 1. Preface
Previously, cookies were operated in the form of document. cookie, which is compatible but troublesome. An individual is a person who prefers to create wheels. Therefore, a tool class is encapsulated for cookies. For a long time, I like to write code, but I don't like text summarization, and I don't like to write something fragmented. It seems I have to change it.
Ii. Ideas
(1) how to encapsulate and encapsulate
How to encapsulate: the native js is encapsulated into a tool, so that it can be used anywhere. For document. cookie encapsulation, all operations are based on document. cookie.
Encapsulation: it can exist in the form of an object, and the implementation of the getter & setter method can be used.
(2) encapsulation methods
Get (), set (name, value, opts), remove (name), clear (), getCookies (), etc. I personally think that using cookies is sufficient to encapsulate so many methods.
Iii. Action
(1) understand the cookie. The essence of the cookie is the HTTP cookie. document. cookie when the client displays objects. For more information, see the following code as a comment.
(2) code: the code should be intuitive and can be compressed together with the project code. I think the comments at the beginning below are important.
The Code is as follows:
/*
* HTTP Cookie: stores session information.
* Names and values must be encoded by RUL.
* If a cookie is bound to a specified domain name, it cannot be shared by the local domain, but the cookie can be shared to the sub-site on the main site.
* There are some restrictions on cookies: for example, IE6 and IE6 are limited to 20, IE7 is 50, and Opear is 30... therefore, cookies are generally set as required.
* The cookie name is case-insensitive. We recommend that you encode the cookie URL. The path is a good way to distinguish between cookies in different situations.
* It is sent to the server under SSL, but http does not. We recommend that you set expires, domain, and path for cookies. Each cookie is smaller than 4 kb.
**/
// Encapsulate cookies by getter and setter
(Function (global ){
// Obtain the cookie object, expressed as an object
Function getCookiesObj (){
Var cookies = {};
If (document. cookie ){
Var objs = document. cookie. split (';');
For (var I in objs ){
Var index = objs [I]. indexOf ('= '),
Name = objs [I]. substr (0, index ),
Value = objs [I]. substr (index + 1, objs [I]. length );
Cookies [name] = value;
}
}
Return cookies;
}
// Set cookie
Function set (name, value, opts ){
// Opts maxAge, path, domain, secure
If (name & value ){
Var cookie = encodeURIComponent (name) + '=' + encodeURIComponent (value );
// Optional parameter
If (opts ){
If (opts. maxAge ){
Cookie + = '; max-age =' + opts. maxAge;
}
If (opts. path ){
Cookie + = '; path =' + opts. path;
}
If (opts. domain ){
Cookie + = '; domain =' + opts. domain;
}
If (opts. secure ){
Cookie + = '; secure ';
}
}
Document. cookie = cookie;
Return cookie;
} Else {
Return '';
}
}
// Obtain the cookie
Function get (name ){
Return decodeURIComponent (getCookiesObj () [name]) | null;
}
// Clear a cookie
Function remove (name ){
If (getCookiesObj () [name]) {
Document. cookie = name + '=; max-age = 0 ';
}
}
// Clear all cookies
Function clear (){
Var cookies = getCookiesObj ();
For (var key in cookies ){
Document. cookie = key + '=; max-age = 0 ';
}
}
// Obtain all cookies
Function getCookies (name ){
Return getCookiesObj ();
}
// Resolve the conflict
Function noConflict (name ){
If (name & typeof name = 'string '){
If (name & window ['cooker']) {
Window [name] = window ['cooker'];
Delete window ['cookies'];
Return window [name];
}
} Else {
Return window ['cookies'];
Delete window ['cookies'];
}
}
Global ['cookies'] = {
'Getcookies ': getCookies,
'Set': set,
'Get': get,
'Delete': remove,
'Clear': clear,
'Noconflict ': noConflict
};
}) (Window );
(3) example
The Code is as follows:
Cookie example