Things about cookies, WebStorage and tokens

Learn about cookies, WebStorage and tokens in 10 minutes

foreword

This article mainly introduces the origin and introduction of the difference between cookie, localstorage and SessionStorage, among which token is a new technology, so there are more introductions. The full text is about 3000 words and read for about 10 minutes. The difference between them and the principle and usage of token generation, the idea of token verification attached below is welcome to add

introduce

The HTTP protocol is stateless(stateless), each request will get a response message, after the response is over服务器不会记录任何关于客户端的访问信息

But in actual development, when the user logs in, we need to let the server know that the user is logged in, and then perform the corresponding operations, so we need to use some techniques to let the server know that we are logged in

cookie: cookie

Cookie is a technology that existed in the 1990s. The essence is that the "k=v" string pair generated by the server is separated by a semicolon. When the user requests the server, it is sent to the client along with the message header (set-cookie). This message is stored in window.document.cookie, when sending the request, 浏览器会自动把cookie放在消息头中（cookie项下）发送给服务器
the cookie has a length limit: 4KB

WebStorage: client storage

This technology is a new technology provided by HTML5 in 2015. It is divided into SessionStorage / localStoragetwo objects. It is essentially the data returned from the server to the client. The client saves it on the browser itself and reads it from its own local storage when it requests the next time. Fetch the data and send it to the server as data.
The size of Webstorage is limited to 8MB

Session: server-side storage

About Session: In the late 1990s, the technology proposed by Java/PHP/.NET and other server-side technology manufacturers is essentially that the server side opens up a storage space for each client (stored in the server-side file/memory/database), Return a session number to the client in the form of a cookie (this is actually a very long identifier used to verify identity). When the client accesses, it will send this number, and the server can find it if it recognizes this number. Some data stored before is equivalent to I went to the gym to apply for a card ( 服务器记住我), and after recharging ( 登陆后), I don’t need money to spend ( 登录), and use this card directly for consumption

Disadvantages: If large-scale projects such as high-concurrency clusters will cause verification failure

Token: token (latest technology)

Token是服务端生成的一串字符串, used as a token for the client to request, for example: when logging in for the first time, the server generates a Token and then returns the Token to the client, and the client only needs to bring this Token to request data in the future , no need to bring your username and password again.

In fact, the simple understanding is:

For example : A company has developed an APP for security. After the user successfully logs in, the account password plus the expiration date are used to generate an encrypted string and then returned to the client. When the client requests Decrypt to verify the integrity of it, give follow-up operations if the verification is successful, and return ( 此思路仅为举例并非所有的token生成方式都是如此) if it fails

The principle of token

Encrypt the payload payloadand Headerinformation with Base64 to form ciphertext payload ciphertext and header ciphertext.(Header和payload下面会讲)
.Link the formed ciphertext with periods, and use the server key to perform HS256 encryption (if you don’t know, click here: RS256, HS256 and SHA-256 ) (currently, HS256 algorithm is used to encrypt more), and generate a signature.
Splice the previous two ciphertexts with ' .' and the signature to form the final token and return it to the server

The specific generation process is as follows

When the user requests, carry the generated token (the token is divided into three parts header密文, payload密文and 签名) to the server. The server parses the first part (header ciphertext), decrypts it with Base64, and knows what algorithm is used for signing. Now the commonly used one is HS256 will be explained later using HS256.
The server uses the original secret key and ciphertext ( header+ separated by ' ') to perform HS256 calculation, and then compares the generated signature with the signature carried by the token. If they are consistent, the token is legal. If they are inconsistent, the original text has been modified payload. .All illegal.
Judging whether it is expired: the client can know the authorization time and validity period in the payload by decrypting Base64the second part ( ). payloadBy comparing this with the current time, it is found whether the token has expired.

The idea of authentication through token

After the user performs login and other operations, the server performs verification, and returns the Token to the client after the verification is successful.
After the client receives the data, save it on the client (local, session) (I usually set it directly as a cookie)
Each time the client requests data/calls the API, it carries the Token to the server.
The server side adopts filterfilter verification (token is divided .into ). If the verification is successful, the request data will be returned, and if the verification fails, an error code will be returned.