Follow the column and take you through JavaScript

preface

Cookies are often mentioned in front-end interviews, and almost every company will be involved. If you often visit some foreign websites, you will encounter a pop-up dialog box to obtain cookies. It can be seen that cookies are very important in practical application!!!

Cookies

A cookie is a piece of data saved locally sent by the server to the user's browser. The next time the user accesses the server, it will be sent to the server. The storage size of client Cookies is 4k.

effect

1. Used for session state management, such as recording user login status
2. Used to record and track user behavior

Common properties

Expires/Max-Age

It is mainly used to set the validity period of Cookies.

Expires is used to execute specific expiration events.

For example, in Node as the server, we can use:

res.setHeader('Set-Cookie', [
  `name=keliq; expires=${new Date(Date.now() + 36000 ).toGMTString()}`,
])

Max age sets the number of seconds after expiration in seconds:

res.setHeader('Set-Cookie', ['name=picker; max-age=10;'])

If Expires and Max age are set at the same time, Max age takes effect.

Secure

When Secure is set to true, the client can receive Cookies only when the server uses SSL and HTTPS

res.setHeader('Set-Cookie', ['Secure-true;'])

HttpOnly

When HttpOnly is set to true, the customer service side cannot use JavaScript to obtain Cookies.

res.setHeader('Set-Cookie', ['httpOnly=true;',])

JavaScript setting cookie s

Set / modify

document.cookie="name=123";

be careful:

document.cookie="name=syl; age=18"

In this case, only name is effective, that is, only one can be set at a time. Therefore, encapsulation or multiple calls are required.

encapsulation

set up

//Set cookies
function setCookie(name,value,MyDay){
    var ExDate = new Date();
    ExDate.setDate(ExDate.getDate() + MyDay);//If it takes time, get it like this.
    document.cookie = name + "=" + value + ";expires=" + ExDate;
}

obtain

//Get cookies
function getCookie(name){
    //For example, the cookie is "username=abc; password=123"
    var arr = document.cookie.split('; ');//Divide cookie s with ";" and spaces
    for(var i = 0 ;i < arr.length ; i++){
        var arr2 = arr[i].split("=");
        if(arr2[0] == name){
            return arr2[1];
        }
    }
    return "";//If it is not found after the whole traversal, it returns a null value
}

delete

//delete cookies 
function removeCookie(name){
    setCookie(name, "1", -1)//The second value is set to any value, and the third value is set to - 1, indicating that it has expired.
}

shortcoming

The following disadvantages come from encyclopedia

1. To some extent, cookies have seriously endangered the user's life Privacy and security . One way is that some company executives visit websites they have never visited (found through search engines) for some purpose (such as Market Research), and these websites contain a web bug The picture is transparent and has only one pixel size (for hiding). Their function is to write all computers that have visited this page to a Cookie. then, Electronic Commerce The website will read the Cookie information, look for the website where these cookies are written, and then send an advertisement containing relevant products for this website Spam To these senior people.

2. Although cookies are not as dangerous as computer viruses, they still contain some sensitive messages: user name, computer name, browser used and website visited. Users don't want this content to leak out, especially when it also contains private information.

   This is not alarmist, Cross site scripting (Cross site scripting) can achieve this. When attacked by Cross site scripting, Cookie thieves and Cookie poisoning will steal content. Once a Cookie falls into the hands of an attacker, it will reproduce its value.

   • Cookie Thief: a hacker who collects user cookies and sends them to the attacker. The attacker will use cookie messages to enter the user account by legal means.
   • Cookie poisoning: it is generally believed that the cookie has not been modified during storage and return to the server, and the attacker will modify the cookie before returning it to the server to achieve his own purpose. For example, the cookie of a shopping website contains the amount payable by the customer. The attacker reduces the value to achieve the purpose of less payment.