This is a creation in Article, where the information may have evolved or changed.
0x0 What is JWT
JWT is the abbreviation for JSON Web token and can be used as an authorization certificate. Traditional authorization authentication generally uses session, because the session is stored on the server, increasing the calculation of the service side,
And there is a problem of session synchronization between multiple servers. While JWT is stored on the client side, it not only reduces the computational capacity of the server, but also natively supports the distribution.
The structure of the 0x1 JWT
JWT is made up of three parts:
Header: header, indicating type and encryption algorithm
Claims: Declaration, load (hosted content)
Signature: The signature, this part is the header and claims Base64 transcoding, and the header declared in the encryption algorithm added salt (secre) after the composition.
That
Tmpstr = Base64 (header) +base64 (claims)
Signature = Encrypt (Tmpstr,secret)
The last three use "." Connection, i.e.:
token = Base64 (header). Base64 (claims). Signature
A detailed introduction can be seen in the JWT Chinese documentation.
In addition JWT official website has debugging tool, can assist to check wrong.
How 0x2 is used in the Web
The client sends a login request (this login request does not require JWT verification) and returns token in the login request.
The client saves tokens, and later requests for tokens are brought to the header.
0x3 Combat
Using JWT in the echo frame
Here are the official documents and tutorials, which are more clearly said.
We only need to generate a JWT token in the login interface and return, and the JWT middleware will automatically help us do the JWT verification. You can route the packet first, and use the JWT middleware in the grouping.
If you do not use frames, you can use Jwt-go directly
With Axios.js
Our front-end use of the Vue+axios, he too every time to splice header trouble, so help him in the online check, you can configure Axios to automatically add header.
The code for Axios is as follows: Refer to this blog
require(' Es6-promise ').Polyfill(); //Introduction Once on the lineImportAxios from ' Axios ';//Create Axios instancesConstAxios= Axios.Create({ BaseURL: ' Your base URL ', Timeout: the, });Axios.Interceptors.Request. Use(config= { if(Config.Method === ' Post '){ ConstFormData= New FormData(); Object.Keys(Config.Data).ForEach(Key= FormData.Append(Key, Config.Data[Key]); Config.Data =FormData; } if(Config.URL !="/login" && Localstorage.token != undefined){ Config.Headers.Authorization = ' Bearer ' + Localstorage.token; } returnConfig; },Error= { return Promise.Reject(Error); });Axios.Interceptors.Response. Use(Res= { return Promise.Resolve(RES); },Error= { return Promise.Reject(Error); });//Add an Axios instance to the Vue prototype objectExport default { Install(Vue){ Object.DefineProperty(Vue.prototype, ' $Axios ', { value:Axios}); }};
Note if (Config.method = = = ' Post ') here is the post of the past data into a form, if not add this sentence, submitted past is the text, on the server side can not be used Getpost (key) This way to get parameters.
0x4 Commissioning
To be good at using the official website Debugging tools, I will be in JWT encryption on the hole.
HS256 is used for encryption, and HS512 is used for authentication.
0x5 extension
Because the JWT payload uses base64 encoding, it can be easily cracked, so do not put in sensitive information, nor suggest putting too much information.
A JWT can have an expiration date, so it can be used for time-sensitive applications and does not require a database.
Also avoid a JWT replay attack.