How to use Cookies in JavaScript _ basic knowledge-js tutorial

This article describes how to use Cookies in JavaScript, including how to store and delete Cookies. For more information, see What is Cookies?

The Web browser communicates with the server over HTTP, and HTTP is a stateless protocol. However, for a commercial website, it needs to maintain different sessions between pages. For example, after completing multiple pages, a user registration is completed. However, how can we maintain the session information of all web users.

In many cases, cookies are used to recall and track preferences, purchases, commissions, and the most effective way to require better access experience or website statistics.
How does it work?

The server sends some data to the visitor's browser in the form of a cookie. The browser can accept cookies. If so, it is a plain text record stored on the hard drive for visitors. Now, when a visitor arrives at another page on your website, the browser sends the same cookie to the server for retrieval. Once retrieved, the server knows/remembers what storage has just happened.

Cookies have plain text data records for five variable-length fields:

• Expires: the date on which the cookie will expire. If this is blank, the cookie will expire when the visitor exits the browser.
• Domain: the Domain Name of the website.
• Path: Specifies the cookie directory or webpage. If you want to access any directory or page, the cookie is empty.
• Secure: If this field contains the word "security", the cookie can only retrieve one Secure server. If this field is empty, there is no restriction.
• Name = Value: Cookie is obtained in the form of key and Value pairs.

The data originally designed for CGI programming and cookies is automatically transmitted between the Web browser and the Web server, therefore, CGI scripts on the server can read and write the cookie values stored on the client.

JavaScript can also use the cookie attribute of the Document Object. JavaScript can read, create, modify, and delete Cookies or Cookies that apply to the current webpage.
Store Cookies:

The simplest way to create a cookie is to assign a string value to the document. cookie object, which is like this:
Syntax

Document. cookie = "key1 = value1; key2 = value2; expires = date ";

Here, the expires attribute option. If this property is provided with a valid date or time, then the cookie will expire on the given date or time, and then the cookie value will not be accessible.

Note: the Cookie value may not contain semicolons, commas (,), or white spaces. For this reason, you may need to use the JavaScript escape () function to encode the stored values before the cookie. In this case, you must use the corresponding scape SCAPE () function when reading the cookie value.
Read Cookies:

Reading cookies is as simple as writing, because the value of document. cookieobject is cookie. Therefore, you can use this string whenever you want to access the cookie.

The string document. cookie will continue to be separated by semicolons, where name is the name of a cookie and the value is the list of name = value pairs separated by its string values.
Set the cookie expiration date:

You can extend the life cycle of the current browser session cookie by setting the expiration date and saving the expiration date in the cookie. This can be done by setting the date and time of the expires attribute.
Example:

The following example shows how to set cookieexpiration after 1 month: