What are cookie s in JavaScript?

         Let's take an example: if we have a web page or website, we want to store user information (registration or login details) in it, so that when the user returns to the same page, the server knows the user and presents the user information on the required page. Therefore, cookie s store user information therein.

         Create Cookie:

         In JavaScript, creating cookies is a very simple process. We write the following line to create a cookie containing user information. For example, we want to store the user name of the currently logged in user.

<span style="background-color:#f2f2f2"><span style="color:rgba(0, 0, 0, 0.8)"><span style="color:#292929 "> document. cookie =" username = David Warner; "</span></span></span>

         The above line creates a cookie named user name, but we should also mention the expiration date, that is, the time when the cookie should be deleted. If we do not mention the expiration date, the cookie will be deleted when the browser is closed. For example, we want to delete the cookie of the currently logged in user when the user logs off.

         We can mention the expiration date when creating the cookie, as follows:

<span style="background-color:#f2f2f2"><span style="color:rgba(0, 0, 0, 0.8)"><span style="color:#2929 "> documentation. cookie = "username = David Warner; expiration = Thursday, November 17, 2022 23:00:00 UTC;"</span></span></span>

         Or you can delete it when the browser is closed.

         When creating a cookie, another attribute needs to be set, that is, path:

   path=path (for example, '  /',' / mydir '), if not specified, defaults to the current path of the current document location.

        I mentioned path = '/' because I want to access cookie s anywhere on my website.

         Delete Cookie:

         Above, we have created cookies for a year. Now, if we want to delete cookies when the user logs off, under the click event listener of the logout button or any HTML element you use to log off, we will write the following code:

<span style="background-color:#f2f2f2"><span style="color:rgba(0, 0, 0, 0.8)"><span style="color:#292929">document.cookie = "username= ; expires = Thu, 01 Jan 1970 00:00:00 GMT;path=/";</span></span></span>

         In the above code, the name of the cookie, that is, the user name, is cleared, the expiration date is set to the past date, and the cookie is deleted.

         Get cookies:

         To get the current cookie, we simply write:   document.write

        Here is the code I use to create, get, and delete cookie s in one of my projects:

<span style="background-color:#f2f2f2"><span style="color:rgba(0, 0, 0, 0.8)"><span style="color:#292929">function createCookie(userKey,r_token){ 
    let separator = ";" ; 
    document.cookie = "user_key=" + userKey + ";expires = 2022 Thursday, 17 November:00:00 UTC;path=/"; 
    document.cookie = "renew_token = " + r_token + ";expires = 2022 Thursday, 17 November:00:00 UTC;path=/" 

}</span></span></span>

         In the above code, I want to store two values in the cookie, so I can use the above method to create two cookies with two different values respectively, or we can write the following code:

<span style="background-color:#f2f2f2"><span style="color:rgba(0, 0, 0, 0.8)"><span style="color:#292929">function createCookie(userKey,r_token){ 
    let separator = ";" ; 
    Let value = [userKey,r_token].join(separator); 
    document.cookie = "myValues="+values+";expires = 2022 Thursday, 17 November:00:00 UTC;" 
}</span></span></span>

         Delete cookie s on logoff:

<span style="background-color:#f2f2f2"><span style="color:rgba(0, 0, 0, 0.8)"><span style="color:#292929">document.getElementById("logoutBtn").addEventListener("click",function(){ 
    document.cookie = "user_key= ; expires = Thu, 01 Jan 1970 00:00:00 GMT;path=/"; 
    document.cookie = "renew_token= ; expires = Thu, 01 Jan 1970 00:00:00 GMT;path=/" 

})</span></span></span>

         I hope this article helps to understand the concept of cookie s.

Seven claw 7claw.com