The HTTP protocol, also known as the Hypertext Transfer Protocol, is an application layer communication protocol based on TCP/IP. This protocol specifies the rules for mutual communication between the browser and the World Wide Web server (message, request message, response message)
request method
HTTP sets eight ways to send requests. There is no essential difference between these eight methods. They just make the request more semantic.
The eight methods are: OPTIONS/HEAD/GET/POST/PUT/DELETE/TRACE/CONNECT, the most commonly used are get and post
get request: Get data from a specified resource; generally used when simply getting non-sensitive data; get request has no request body
post request: submit the data to be processed to the specified resource; generally used when the result of the request has persistent side effects and transmits relatively sensitive data;
Common get requests are:
① When entering the URL in the address bar of the browser (that is, when the browser requests the page and cannot be changed manually)
② HTML tags that request external resources, such as <img>/<a>/<link>/<script>, and cannot be changed manually
③When the form is submitted, if the method is not specified, get is used by default
④ When sending an ajax request, get is used by default
request message
Get request packet analysis:
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange
Accept-Encoding: gzip, deflate, br
Accept-Language: zh-CN,zh;q=0.9
Connection: keep-alive
Cookie: oschina_new_user=false; user_locale=zh-CN;
Host: gitee.com
Referer: https://gitee.com/login
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/110.0.0.0 Safari/537.36
Pragma: no-cache
Cache-Control: no-cache
Upgrade-Insecure-Requests: 1
DNT: 1Accept: indicates the type and priority of the resource that the browser can receive, q indicates the priority, if the priority is not written, the default is 1, and the priority is the highest;
Accept-Encoding: Indicates that the browser can receive the compressed file type of the server;
Accept-Language: Indicates the language types and priorities that the browser can support;
Connection: If it is keep-alive, it means that it supports long connection;
Host: Indicates the target host sending the request;
Referer: Indicates where the request is sent from, it can be used for anti-hotlinking and advertising billing
Cookie: Indicates Cookie;
User-Agent: Indicates the user agent, which was used to judge the user's browser brand and version before, but it is useless now;
Pragma: Indicates that the cache is not taken
Cache-Control: Indicates no cache (strong cache)
Upgrade-Insecure-Requests: Indicates that the more secure https protocol can be used
DNT: Indicates whether it can be tracked, 0 means it can be tracked, 1 means it is forbidden to track
The above-mentioned similar key is also included in the post message, which also includes:
Content-length: Indicates the length of the returned data;
Origin: Indicates the simplified version of Referer, which can also be used for anti-hotlinking and advertising billing
Content-Type: Indicates the type of data sent
response message
The response header of the get response is the same as that of the post response (may contain the following keywords), but the get request does not have a response body
access-control-allow-origin: *
access-control-expose-headers: *
content-length: 0
date: Tue, 21 Feb 2023 02:13:00 GMT
eagleid: 2a30782016769455799488802e
server: Tengine
timing-allow-origin: *
via: cache33.l2cm9-6[50,0], kunlun12.cn350[78,0]
x-log-requestid: 63F428ABCEBF10C607123897
x-log-time: 1676945580Common response status codes:
200 ok indicates that the request was successful (optimal state)
201 Created indicates that it has been created, that is, a new resource has been successfully requested and created
301 means redirection, which means that the requested old resource is permanently removed (inaccessible), and will jump to a new resource, and the search engine will replace the old URL with the redirection while crawling new content after the address;
302 means redirection, which means that the requested old resource is still there (still accessible), but it will temporarily jump to a new resource, and the search engine will grab the new content and save the old URL;
304 indicates that the requested resource is redirected to the cache (that is, the negotiation cache is hit)
401 Unauthorized means unauthorized / request requires user authentication
404 Not Found means that the server cannot find the resource according to the client's request, which is usually the fault of the front end~
500 Internal Server Error indicates that the server has an internal error and cannot complete the request;
502 indicates that the connection to the server failed (the server may need other servers to cooperate when processing a request, but it cannot contact other servers)
request parameters
There are three types of request parameters: query parameters (query string parameters), params parameters, and request body parameters;
- query parameter (query string parameter)
The query parameter is included in the request address (url), and the key-value combination is connected with &, such as name=team&age=19 (this method is called urlencoded encoding method)
- params parameter
The params parameter is also included in the request address, and the routing path uses :key as a placeholder, such as /team/18
- request body parameters
The request body parameters are included in the request body in the request message, and there are two commonly used formats:
①urlencoded format
Such as name=team&age=18, corresponding to the request header
Content-Type: application/x-www-form-urlencoded②json format
Such as {"name": "tom", "age": 12}, corresponding to the request header
Content-Type: application/jsonReplenish:
Generally, when sending a post request through a form form, the request body parameter is used by default, and the encoding format is urlencoded encoding;
Classic interview questions:
From the time the user enters the URL and presses Enter until the user can see the interface, what has happened during the period?
① DNS resolution
Perform domain name resolution according to the browser DNS cache, local DNS cache, router DNS cache, and operator DNS cache in turn. If there is no corresponding domain name in the cache, go to the DNS root server to find it;
② TCP connection through three-way handshake
Popular explanation:
The first handshake: sent from the browser to the server, I want to talk to you, can you hear me?
The second handshake: sent by the server to the browser, I can hear it, tell me!
The third handshake: sent by the browser to the server, okay, then I will start talking!
③Send request
④ got a response
⑤Browser parsing html
Pre-parsing: send requests for all external resources;
Parse html and generate DOM tree;
Parse CSS and generate a CSS tree;
Merge into a render tree;
Whether js has manipulated the DOM or style, if yes, it will redraw and rearrange, if not, it will not be processed;
final display interface
⑥Disconnect the TCP connection by waving four times
The first wave: sent by the browser to the server, my things are accepted, please disconnect;
The second wave: sent by the server to the browser, I still have some things to receive, I will tell you when I receive it; or sent by the server to the browser, my things have been received, but you have to wait for a while , I want to verify the integrity of the data, and I will tell you after the verification is completed;
The third wave: sent by the server to the browser, I have finished receiving it, please disconnect;
Waved for the fourth time: the browser sent it to the server again, OK, I disconnected;