Interpretation of hypertext: The so-called hypertext refers to the content transmitted not only text content (html, css), but also some other resources, such as audio, pictures, videos, etc.

HTTP is an application layer protocol based on the TCP protocol. No matter which application is implemented (not necessarily a browser), as long as the data is encoded and parsed according to the format specified in the protocol, the encoding is completed and sent through the socket api.
Received Then the data can be parsed according to the specified format.

Common application scenarios:

Communication between browser and server
Communication between mobile phone and server
Call between multiple servers (request forwarding)

2. HTTP development history

HTTP is often implemented based on the TCP protocol at the transport layer . (HTTP1.0, HTTP1.1, HTTP2.0 are all TCP, and HTTP3 is implemented based on UDP )

At present, we mainly use HTTP1.1 and HTTP2.0. This article mainly focuses on HTTP version 1.1 .

3. HTTP request and response

When we enter the URL (such as www.baidu.com) in the browser, the domain name is resolved into an ip address through DNS, and an HTTP request (request) is sent to the server for TCP/IP. After receiving the request, the server analyzes which URLs the user needs to visit resources, and then send the required resource response (response) to the browser, and the browser parses the response data and renders it to the page.

When sending a request and receiving a response, how do we view the specific information of the request and the specific information of the response?

4. The method and tool of packet capture Fiddler

1. Developer Tools

No matter which browser we are in, when we press F12 on the keyboard (you can press Fn+Esc to open FnLock), we can open the developer tool, and the Network (or network) in it is the specific request and response information for visiting the website

FireFox accesses Baidu page

Google Chrome visits Baidu page

2.Fiddler

You can download the packet capture tool through the official website Fiddler , just download the Fiddler Classic version

View the information of the request message in Notepad

How Fiddler works

When the browser sends a request to the server, Fiddler gets the request after the browser sends the request, and then Fiddler sends the request to the server. When the server sends a response, Fiddler first receives the response, and then sends the response to the browser. device.

2. Request and response

1. Request and response messages

The following is the general structure of the specific request and response message

2. URL structure

URL: (Uniform Resource Locator Uniform Resource Locator )

URI: (Uniform Resource Identifier Uniform Resource Identifier ), generally understood as the same meaning when used

The following is a common URL address

https : Protocol scheme name . The common ones are http and https, and there are other types . ( For example, jdbc:mysql used when accessing mysql )
user:pass : login information . The identity authentication of the current website is generally no longer done through the URL . It is generally omitted
www.javacn.site : server address . This is a " domain name ", and the domain name will be resolved into a specific IP address through the DNS system . ( You can see through the ping command that the real IP address of www.javacn.site is 82.157. 146.10 ) can directly access the above website
Port number : The port number in the above URL is omitted . When the port number is omitted , the browser will automatically determine which port to use according to the protocol type . For example, the http protocol uses port 80 by default , and the https protocol uses port 443 by default .
/interview/net/tcpip.html : file path with hierarchy .
userId=10000&classId=100 : query string (query string). It is essentially a key-value pair structure . Key-value pairs are separated & . Keys and values are separated by = .
Fragment identifier: The fragment identifier is omitted in this URL . The fragment identifier is mainly used for in-page jumps.

For example, the content of an article is very long, and it is easy to locate a certain position of the article by using the fragment mark

Omittable part of the URL

Protocol name : can be omitted , and defaults to http:// after omission

IP address / domain name : Can be omitted in HTML ( such as img, link, script, src or href attribute of a tag ). Province

The latter indicates that the server's ip/ domain name is consistent with the ip/ domain name to which the current HTML belongs .

Port number : can be omitted . After omission, if it is http protocol , the port number is automatically set to 80; if it is https protocol , the port number is automatically

Automatically set to 443.

Hierarchical file path : can be omitted . After omitting, it is equivalent to /. Some servers will automatically access when they find the / path

/index.html

query string : can be omitted

Fragment ID : can be omitted

about query string

?Followed by the query string, it is also expressed in the form of key-value pairs. If key=value has multiple key-value pairs, & should be used to separate
key=value&key1=value1&key2=value2

About URL encode

Some special characters (such as '/', ':') have been used, so these characters cannot appear at will, but we still need to use some special characters, or Chinese characters, at this time, we need to perform special characters first escape.

The rules of escaping are as follows : convert the characters to be transcoded into hexadecimal , and then from right to left, take 4 digits ( less than 4 digits and process them directly ) , make one digit for every 2 digits, add % in front , and encode it as % XY format

Next, we search in Baidu: love, we can see that wd= %E7%88%B1%E6%83%85, love escape becomes the hexadecimal string after wd, and we can use the control in the developer tool Taiwan, use encodeURI for escaping, and decodeURI for deescaping.

3. Common methods

The first line of the request: request method, request address, version number

1. GET method

1. How to send a GET request

Enter the URL address directly from the browser, and the browser will send a GET request by default.
Specify the method of submitting through the form form as GET
Send a GET request via AJAX
Link, img, script and other tags in HTML will also trigger GET requests.

2. Characteristics of GET request

The first part of the first line is GET
The query string of the URL can be empty or not
The header part has several key-value pair structures.
The body part is empty.

Regarding the URL length of GET requests

Some information on the Internet describes that it is wrong to say that the maximum length of a get request is 1024kb .

The HTTP protocol is defined by the RFC 2616 standard , which is clearly stated in the original text of the standard : "Hypertext Transfer Protocol --

HTTP/1.1," does not specify any requirement for URL length.

There is no limit to the length of the URL .

The length of the actual URL depends on the implementation of the browser and the implementation of the HTTP server . On the browser side , the maximum length of different browsers is different , but the length supported by modern browsers is generally very long ; on the server side , generally this length is configurable .

2. POST method

1. How to send a POST request

Through the form form method=post
AJAX way to specify method=post;

2. Characteristics of POST request

Post request for login operation through gitee

The first part of the first line is POST
The query string of the URL is generally empty ( or not empty )
The header part has several key-value pair structures .
The body part is generally not empty . The data format in the body is specified by the Content - Type in the header . The length of the body is specified by the Content - Length in the header .

The role of blank lines between header and body, in order to solve the problem of sticky packages

Interview question: Talk about the difference between GET and POST

First of all, in general, there is no essential difference between GET and POST, and both methods can replace each other
The semantics are different: GET is generally used to obtain data, and POST is generally used to submit data.
Usage habits: The body of GET is generally empty, and the data to be transferred is passed through the query string; the query string of POST is generally empty, and the data to be transferred is passed through the body
GET requests are generally idempotent, and POST requests are generally not idempotent. (If multiple requests get the same result, the request is considered idempotent)
GET can be cached, but POST cannot be cached. (Because GET requests are idempotent (the result is the same), so caching saves bandwidth resources and speeds up access)

3. Other methods

PUT is similar to POST , but it is idempotent and is generally used for updating
DELETE deletes the resource specified by the server
OPTIONS returns the request method supported by the server
HEAD is similar to GET , except that the response body is not returned, only the response header is returned
TRACE echoes the request received by the server, which will be used in the test
CONNECT reserved, not used yet

1.Host

Indicates the host address and port of the server

The domain name will eventually be resolved to an IP address by the DNS server, and the port number determines the process corresponding to the server

2.Content-Length

Indicates the length of the data in the body.
The termination position of the message can be judged according to the length. Generally, we don’t need to specify it manually. The browser and server will calculate and assign the value by themselves.

The length of the body shown above is 469 bytes

3.Content-Type

Indicates the data format in the body of the request .

Common options :

1.application/x-www-form-urlencoded: form

The data format submitted by the form . At this time, the format of the body is as follows :

2.multipart/form-data: The data format submitted by the form form ( add enctyped="multipart/form - data" to the form tag . It is usually used to submit pictures / files .

3. application/json: The data is in json format .

The body format is like

Content-Type is mainly used to mark the type of data transmitted between the client and the server, so as to facilitate the server and client to parse the transmitted data.

4.User-Agent(UA)

Indicates the properties of the browser/operating system

Using UA allows the server to collect the environment of the client, or the environment of the browser/operating system.

According to the user's browser and system version, it can return pages suitable for the current user. For older browsers or systems, some pages with less functions suitable for the old system can be returned. On the contrary, for newer browsers or systems, the function comparison will be returned. new page

5. Refer

The URL from which the record jumps to the current page.

This means jumping from the gitee homepage to my own homepage. .

Actual case: the mall advertises to other platforms, and uses the Referer information to count which platforms users click to enter the mall, so that it can be determined which platform to advertise on in the future with the highest benefit.

A scene:

We know that when we visit the website (login verification), we need to log in the user. When we log in for the first time, we can visit the corresponding website, but at this time we need to visit another website of this site, this Login verification is also required at this time. If the user still sends a login request at this time, the user experience is very poor, because the user has already logged in just now. So how do we solve this problem? Next, Cookie comes on the scene.

A string is stored in the cookie . This data may be written by the client ( webpage ) through JS , or it may come from the server ( the server returns data to the browser through the Set-Cookie field in the header of the HTTP response ).

These are all ways to save simple data in the browser

The previous ones are relatively new and are not used much. Cookies are relatively long and used a lot

Examples of login cases:

When we log in for the first time, the client sends a request to send the login account and password to the server, and the server verifies the account and password. If it is correct, the login is successful, and a login success response will be sent at this time.

Response message for first login

HTTP/1.1 302 Found

Date: Thu, 10 Jun 2021 04:15:58 GMT

Content-Type: text/html; charset=utf-8

Connection: keep-alive

Keep-Alive: timeout=60

Server: nginx

X-XSS-Protection: 1; mode=block

X-Content-Type-Options: nosniff

X-UA-Compatible: chrome=1

Expires: Sun, 1 Jan 2000 01:00:00 GMT

Pragma: must-revalidate, no-cache, private

Location: https://gitee.com/HGtz2222

Cache-Control: no-cache

Set-Cookie: oschina_new_user=false; path=/; expires=Mon, 10 Jun 2041 04:16:00

-0000

Set-Cookie: gitee_user=true; path=/

Set-Cookie: gitee-session

n=M1Rhbk1QUUxQdWk1VEZVQ1BvZXYybG13ZUJFNGR1V0pSYTZyTllEa21pVHlBUE5QU2Qwdk44NXdEam

11T3FZYXFidGNYaFJxcTVDRE1xU05GUXN0ek1Uc08reXRTay9ueTV3OGl5bTdzVGJjU1lUbTJ4bTUvN1

l3RFl4N2hNQmI1SEZpdmVJWStETlJrdWtyU0lDckhvSGJHc3NEZDFWdHc5cjdHaGVtNThNcEVOeFZlaH

c0WVY5NGUzWjc2cjdOcCtSdVJ0VndzdVNxb3dHK1hPSDBDSFB6WlZDc3prUVZ2RVJyTnpTb1c4aFg1Mm

UxM1YvQTFkb1EwaU4zT3hJcmRrS3dxVFZJNXoxaVJwa1liMlplbWR5QXQxY0lvUDNic1hxN2o0WDg1Wk

E9LS10N0VIYXg4Vm5xdllHVzdxa0VlUEp3PT0%3D-

-2f6a24f8d33929fe88ed19d4dea495fbb40ebed6; domain=.gitee.com; path=/; HttpOnly

X-Request-Id: 77f12d095edc98fab27d040a861f63b1

X-Runtime: 0.166621

Content-Length: 92

You can see the set-cookie method in the response, the cookie is set in the client, and then every time a request is sent to the server, the cookie will be sent out in the request header, so that the server can check the cookie If it is reasonable, there is no need to log in again (indicating that you have logged in before), and then send the corresponding response to the front end

Request information about accessing other websites

GET https://gitee.com/HGtz2222 HTTP/1.1

Host: gitee.com

Connection: keep-alive

Cache-Control: max-age=0

Upgrade-Insecure-Requests: 1

User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML,

like Gecko) Chrome/91.0.4472.101 Safari/537.36

Accept:

text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,imag

e/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9

Sec-Fetch-Site: same-origin

Sec-Fetch-Mode: navigate

Sec-Fetch-User: ?1

Sec-Fetch-Dest: document

sec-ch-ua: " Not;A Brand";v="99", "Google Chrome";v="91", "Chromium";v="91"

sec-ch-ua-mobile: ?0

Refer: https://gitee.com/login

Accept-Encoding: gzip, deflate, br

Accept-Language: zh-CN,zh;q=0.9,en;q=0.8

Cookie: oschina_new_user=false; user_locale=zh-CN; yp_riddler_id=1ce4a551-a160-

4358-aa73-472762c79dc0; visit-gitee--2021-05-06%2010%3A12%3A24%20%2B0800=1;

sensorsdata2015jssdkcross=%7B%22distinct_id%22%3A%22726826%22%2C%22first_id%22%3

A%22175869ba5888b6-0ea2311dc53295-303464-2073600-

175869ba5899ac%22%2C%22props%22%3A%7B%22%24latest_traffic_source_type%22%3A%22%E

7%9B%B4%E6%8E%A5%E6%B5%81%E9%87%8F%22%2C%22%24latest_search_keyword%22%3A%22%E6%

9C%AA%E5%8F%96%E5%88%B0%E5%80%BC_%E7%9B%B4%E6%8E%A5%E6%89%93%E5%BC%80%22%2C% 22%2

4latest_referrer%22%3A%22%22%7D%2C%22%24device_id%22%3A%22175869ba5888b6-

0ea2311dc53295-303464-2073600-175869ba5899ac%22%7D; remote_way=svn;

tz=Asia%2FShanghai;

Hm_lvt_24f17767262929947cc3631f99bfd274=1622637014,1622712683,1622863899,1623298

442; Hm_lpvt_24f17767262929947cc3631f99bfd274=1623298550; gitee_user=true;

gitee-session

n=M1Rhbk1QUUxQdWk1VEZVQ1BvZXYybG13ZUJFNGR1V0pSYTZyTllEa21pVHlBUE5QU2Qwdk44NXdEam

11T3FZYXFidGNYaFJxcTVDRE1xU05GUXN0ek1Uc08reXRTay9ueTV3OGl5bTdzVGJjU1lUbTJ4bTUvN1

l3RFl4N2hNQmI1SEZpdmVJWStETlJrdWtyU0lDckhvSGJHc3NEZDFWdHc5cjdHaGVtNThNcEVOeFZlaH

c0WVY5NGUzWjc2cjdOcCtSdVJ0VndzdVNxb3dHK1hPSDBDSFB6WlZDc3prUVZ2RVJyTnpTb1c4aFg1Mm

UxM1YvQTFkb1EwaU4zT3hJcmRrS3dxVFZJNXoxaVJwa1liMlplbWR5QXQxY0lvUDNic1hxN2o0WDg1Wk

E9LS10N0VIYXg4Vm5xdllHVzdxa0VlUEp3PT0%3D-

-2f6a24f8d33929f e88ed19d4dea495fbb40ebed6

The content in the request body is determined by the Content-Type and Content-Length in the request header. Specifically, Content-Type shows the content of the request body

Four. Response

HTTP/1.1 200 OK
Server: nginx
Date: Fri, 16 Jun 2023 02:39:52 GMT
Content-Type: text/html; charset=utf-8
Transfer-Encoding: chunked
Connection: keep-alive
Vary: Accept-Encoding
Set-Cookie: black_passportid=; path=/; expires=Thu, 01 Jan 1970 00:00:00 GMT; domain=.sogou.com
Pragma: No-cache
Cache-Control: max-age=0
Expires: Fri, 16 Jun 2023 02:39:52 GMT
UUID: 15d42449-0c66-4731-8e40-72ff80e09202
Content-Encoding: gzip

1. Common status codes

The status code indicates the result of accessing a page . ( Is the access successful , or failed , or some other situation ...).

1.200 OK

Indicates that the access is successful

Note: When capturing the packet, you can see the compressed data of the request body

" Bandwidth " is a scarce resource in network transmission , and data is often compressed for higher transmission efficiency .

we can click

Perform decompression operation, the following is the data after decompression

2.403 Forbidden

Indicates that access is denied . Some pages usually require the user to have certain permissions to access ( only after logging in ). If the user does not log in and directly accesses , it is easy to see 403.

The resource on the server exists, but it is not authorized to the current user, that is to say, the current user has no right to access, and a 403 status code is returned

3.404 Not Found

Indicates that the resource was not found. This is also a common problem in our development, usually because the URL is wrong

4.405 Method Not Allowed

If the client sends a GET request to the server, the
server must have a method to receive the GET request to process the request.
If the client sends a POST request to the server,
the server must also have a method to receive the POST request to process the POST request.

If we send a post request to the server, but the server does not have a way to process the post request, a 405 error will be reported at this time

5.500 Internal Server Error

The server has an internal error . Generally, this status code is generated when the server encounters some special circumstances during code execution ( the server crashes abnormally ) .

6.504 Gateway Timeout

When the server load is relatively large , it takes a long time for the server to process a single request , which may cause a timeout .

7.301 Moved Permanently

Indicates a permanent redirect.

Understanding " redirection "

It is equivalent to the " call forwarding " function in the mobile phone number .

For example, my original mobile phone number is 186-1234-5678, and later I changed to a new number 135-1234-5678, so there is no need to ask my friend

Friends know the new number ,

As long as I go to handle a call transfer service , other people dial 186-1234-5678, it will be automatically transferred to 135-1234-5678

on .

A common scenario is that the old domain name is no longer used, and the current user is forced to jump to the new domain name when accessing the old domain name

The Location field indicates the page to be redirected

8.302 Move temporarily

Indicates a temporary redirection.

This redirection is temporary and may not be needed later.

1.Content-Type

Common values of Content-Type in the response are as follows:

text/html: body data format is HTML
text/css: body data format is CSS
application/javascript: body data format is JavaScript
application/json: body data format is JSON

5. Send POST and GET requests

1. Construct HTTP request through form form

Important parameters of the form form

action: What is the URL of the constructed HTTP request .
method: The method of the constructed HTTP request is GET or POST (form only supports GET and POST).

1.GET

<body>
    <form method="get" action="calc">
        <div style="margin-top: 50px; margin-left: 50px;">
            <h1>计算器--add</h1>
            num1:<input name="num1"><br>
            num2:<input name="num2"><br>
            <input type="submit" value="相加"><br>
        </div>
    </form>
</body>

page effect

Enter the value in the text box and click the add button to submit it to the specified action according to the method.

For the request submitted by get method, we can see that num1 and num2 are spliced into the query string for transmission

2.POST

<body>
    <form method="post" action="calc">
        <div style="margin-top: 50px; margin-left: 50px;">
            <h1>计算器--add</h1>
            num1:<input name="num1"><br>
            num2:<input name="num2"><br>
            <input type="submit" value="相加"><br>
        </div>
    </form>
</body>

The post request is submitted, and the data is stored in the request body (body) in the format of application/x-www-form-urlencoded

POST http://localhost:63342/Data%20Structure%20and%20Algorithm/Servlet-demo1/src/main/webapp/calc HTTP/1.1
Host: localhost:63342
Connection: keep-alive
Content-Length: 15
Cache-Control: max-age=0
sec-ch-ua: "Not.A/Brand";v="8", "Chromium";v="114", "Google Chrome";v="114"
sec-ch-ua-mobile: ?0
sec-ch-ua-platform: "Windows"
Upgrade-Insecure-Requests: 1
Origin: http://localhost:63342
Content-Type: application/x-www-form-urlencoded
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7
Sec-Fetch-Site: same-origin
Sec-Fetch-Mode: navigate
Sec-Fetch-User: ?1
Sec-Fetch-Dest: document
Referer: http://localhost:63342/Data%20Structure%20and%20Algorithm/Servlet-demo1/src/main/webapp/calc.html?_ijt=o10fgu7m56l1b7gr29mv0mfcmh&_ij_reload=RELOAD_ON_SAVE
Accept-Encoding: gzip, deflate, br
Accept-Language: zh-CN,zh;q=0.9,en-US;q=0.8,en;q=0.7
Cookie: Idea-1c60499a=fb667c55-de72-45c7-b097-0117c2af38f3

num1=12&num2=13

2. Construct HTTP request through ajax

From the perspective of the front end , in addition to the browser address bar can construct GET request , the form form can construct GET and POST , HTTP request can also be constructed through ajax . And the function is more powerful .

The full name of ajax is A synchronous J avascript A nd X ML, which is a kind of JavaScript proposed in 2005 to send to the server

The way of HTTP request . (Mostly use json instead of xml form now)

The feature is that data transmission can be performed without refreshing the page / page jump . Partial refresh, only modify some tags

The biggest advantage of ajax : traditional form form submission will cause page jumps, ajax will not cause jumps, partial update

Ways to implement ajax: ① XMLHttpRequest built-in implementation (complex, no explanation) ② jQuery encapsulates common operations (emphasis)

import jquery

We can download a package from the Internet and put it under the project. The recommended system is jquery.min.js. This package is smaller and easy to save resources. The effect of using it is the same as that of the non-min version.

Next, you can introduce jquery into the script tag in the head.

1.GET

the first method

jQuery.get(url, callback), the first parameter is the submitted url, and the second parameter is the callback function (not recommended)

            jQuery.get("calc_ajax",function (res){
                alert(res.data+" "+res.code);
            })

The second method (recommended)

            //发送Ajax请求到后端
            jQuery.ajax({
                url: "calc_ajax",  //提交的地址
                method: "GET",     //请求的类型
                data: {
                    "num1": num1.val(),
                    "num2": num2.val()
                },
                success: function (res) {
                    if (res.code == 200) {
                        alert("计算的结果为:"+res.data);

                    } else {
                        alert("操作失败" + res.msg);
                    }

                }
            });

Send ajax request information: data splicing in query string

GET http://localhost:8080/Servlet_demo1_war/calc_ajax?num1=12&num2=13 HTTP/1.1
Host: localhost:8080
Connection: keep-alive
sec-ch-ua: "Not.A/Brand";v="8", "Chromium";v="114", "Google Chrome";v="114"
Accept: */*
X-Requested-With: XMLHttpRequest
sec-ch-ua-mobile: ?0
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36
sec-ch-ua-platform: "Windows"
Sec-Fetch-Site: same-origin
Sec-Fetch-Mode: cors
Sec-Fetch-Dest: empty
Referer: http://localhost:8080/Servlet_demo1_war/calc-ajax.html
Accept-Encoding: gzip, deflate, br
Accept-Language: zh-CN,zh;q=0.9,en-US;q=0.8,en;q=0.7
Cookie: Idea-1c60499a=fb667c55-de72-45c7-b097-0117c2af38f3

2.POST

the first method

jQuery.get(url, data, callback), the first parameter is the submitted url, the second is the submitted parameter, and the third parameter is the callback function

            jQuery.post("calc_ajax",{
                id:10,
                name:"张选宁"
                },
                function (res){
                    alert(res.data+" "+res.code);
                });

The second method (recommended)

            //发送Ajax请求到后端
            jQuery.ajax({
                url: "calc_ajax",  //提交的地址
                method: "POST",     //请求的类型
                data: {
                    "num1": num1.val(),
                    "num2": num2.val()
                },
                success: function (res) {
                    if (res.code == 200) {
                        alert("计算的结果为:"+res.data);

                    } else {
                        alert("操作失败" + res.msg);
                    }

                }
            });

Send ajax request information: the data is in the request body (body)

POST http://localhost:8080/Servlet_demo1_war/calc_ajax HTTP/1.1
Host: localhost:8080
Connection: keep-alive
Content-Length: 15
sec-ch-ua: "Not.A/Brand";v="8", "Chromium";v="114", "Google Chrome";v="114"
Accept: */*
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
X-Requested-With: XMLHttpRequest
sec-ch-ua-mobile: ?0
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36
sec-ch-ua-platform: "Windows"
Origin: http://localhost:8080
Sec-Fetch-Site: same-origin
Sec-Fetch-Mode: cors
Sec-Fetch-Dest: empty
Referer: http://localhost:8080/Servlet_demo1_war/calc-ajax.html
Accept-Encoding: gzip, deflate, br
Accept-Language: zh-CN,zh;q=0.9,en-US;q=0.8,en;q=0.7
Cookie: Idea-1c60499a=fb667c55-de72-45c7-b097-0117c2af38f3

num1=15&num2=16

6. HTTPS

1. What is HTTPS

HTTPS (Hyper Text Transfer Protocol Secure ) is an HTTP protocol based on the SSL/TLS protocol, which is a secure version of the HTTP protocol. The HTTPS protocol ensures the security and integrity of data transmission by encrypting communication content and authentication , which can effectively prevent data from being stolen or tampered with during transmission.

The default port number of HTTP is 80, and the default port number of HTTPS is 443

HTTPS = HTTP + encryption + authentication + integrity protection.

2. SSL/TLS protocol

SSL (Secure Socket Layer): Secure Socket Layer protocol. TLS (Transport Layer Security): Transport Layer Security Protocol. SSL (Secure Socket Layer) was first developed by browser developer Netscape, which developed SSL 3.0 and versions before 3.0, and then handed over SSL to the IETF (Internet Engineering Task Force) Internet Engineering Task Force. Currently, the IETF developed TLS 1.0 based on SSL 3.0, so TLS can be considered the "new version" of SSL.

IETF: Internet Engineering Task Force, dedicated to the formulation and promotion of Internet standards, is one of the authoritative organizations in Internet standardization.

3. Why does HTTPS appear?

When we transmit data on the network, if we do not encrypt the data, such as when logging in, we put the account number and password in the response body for transmission in plain text, so that some hackers can hijack our Request information, so as to get our information, or get the token information that the server responds to the client, so that hackers can easily hijack our personal information, which is very unsafe, so we need to control our transmission in the network The data is encrypted so that it is not so easy for hackers to obtain. HTTPS is encrypted on the basis of HTTP to further ensure the security of user information ~

4. Encryption and common encryption methods

Encryption is to perform a series of transformations on plaintext ( information to be transmitted ) to generate ciphertext .

Decryption is to perform a series of transformations on the ciphertext and restore it to plaintext .

In the process of encryption and decryption , one or more intermediate data is often needed to assist in this process . Such data is called a key .

Concrete example:

For example, if we transmit the number 5, our encryption method is to add the key to the plaintext, and the decryption method is to subtract the key from the ciphertext

Plaintext: 5

After encryption: 9

After decryption: 5

Keys: 4

1. Symmetric encryption

An algorithm that uses the same key for encryption and decryption . The sender and receiver must share a secret key to communicate, which makes symmetric encryption algorithms very efficient in terms of confidentiality and performance . Common symmetric encryption algorithms include AES (Advanced Encryption Standard) and DES (Data Encryption Standard)

2. Asymmetric encryption

Also known as public-key encryption, a pair of keys is used, a public key and a private key . The sender uses the receiver's public key for encryption , and the receiver uses its private key for decryption (it can also use the private key for encryption and the public key for decryption). Asymmetric encryption algorithm can realize functions such as encryption and digital signature. The confidentiality is very good, and the performance is relatively low compared with symmetric encryption. Common asymmetric encryption algorithms include RSA and ECC (elliptic curve encryption).

3. Hash function

Called a hash function, it maps input data of arbitrary length to a fixed-length output value (hash value). Hash functions are usually used to verify the integrity of data, common hash functions include MD5, SHA-1, SHA-256, etc. The hash function is irreversible , that is, the original input cannot be restored from the hash value, but it can be compared whether the two data are the same, one data is encrypted and saved, and the other data is encrypted and compared.

Fixed length : No matter how long the string is , the calculated MD5 value is a fixed length (16 -byte version or 32 -byte version )
Dispersion : As long as the source string is changed a little , the final MD5 value will be very different .
Irreversible : It is easy to generate MD5 from the source string , but it is theoretically impossible to restore the original string through MD5 .

5. What is a certificate

A certificate can be understood as a structured string , which contains the following information :

Certificate issuing authority

Certificate Validity

public key

certificate owner

sign

......

View a website's certificate, for example, use Google Chrome browser to view Baidu certificate

The following is the basic information of the certificate

Details below

6. Workflow of HTTPS

Question 1: Transmitting data in clear text will allow hackers to obtain the transmitted information.

1. Introduce symmetric encryption

After the introduction of symmetric encryption , even if the data is intercepted , because the hacker does not know what the key is , he cannot decrypt it , and he does not know what the real content of the request is .

But now there is a problem. The server and the client need to use a key for symmetric encryption, so that the data can be encrypted and decrypted at the same time. If both need to use the same key, the key must be involved The process of transmission, that is, the key needs to be transmitted from the client to the server (or from the server to the client). During the key transmission process, the hacker may obtain the key, decrypt the data and obtain the information. This is also unsafe.

Therefore, the transmission of the key also needs to be encrypted, but symmetric encryption cannot be used at this time. If this is the case, it will become an endless loop problem (repeat the above problem). At this time, we have introduced asymmetric encryption.

2. Introduce asymmetric encryption

The client generates a symmetric key locally , encrypts the symmetric key with the public key , and sends it to the server .
Since the intermediate network device does not have a private key , even if the data is intercepted , the original internal text cannot be restored , and the symmetric key cannot be obtained
The server decrypts through the private key , restores the symmetric key sent by the client , and uses this symmetric key to encrypt the response data returned to the client .
Subsequent communication between the client and the server can only be encrypted using symmetric encryption . Since the key is only known by the two hosts of the client and the server , it is meaningless for other hosts / devices to intercept the data even if they do not know the key .

Since the efficiency of symmetric encryption is much higher than that of asymmetric encryption, asymmetric encryption is only used when the key is negotiated in the initial stage, and symmetric
encryption is still used for subsequent transmissions.

Then the next question arises :

Question 1: How does the client obtain the public key ?

Question 2: How does the client determine that the public key is not forged by hackers ?

3. Import certificate

When the client and server just establish a connection, the server returns a certificate .

This certificate contains the public key just now (solved problem 1), and also contains the identity information of the website.

After the client obtains the certificate, it will verify the certificate (to prevent the certificate from being forged).

Determine whether the validity period of the certificate has expired
Determine whether the issuing authority of the certificate is trusted (the trusted certificate issuing authority built into the operating system).
Verify whether the certificate has been tampered with: Get the public key of the certificate issuing authority from the system, decrypt the signature, get a hash value (called data digest), set it as hash1. Then calculate the hash value of the entire certificate, set it as hash2. Compare whether hash1 and hash2 are equal.
If they are equal, it means that the certificate has not been tampered with. (Solved problem 2)

Understand the data summary/signature
After we join the work, we often involve the "reimbursement" scene. If you want to reimburse with the invoice, you need the approval of the leader. But the leader can't go to finance with you. What should we do? It's very simple
, It is enough for the leader to sign for you. Finance sees the signature of the leader, "seeing the words is like seeing a person".
Because different people, the "signature" will be very different. Using the signature can distinguish a specific People.
Similarly, for a piece of data (such as a string), you can also use some specific algorithms to generate a "signature" for this string. And to ensure that different data, the generated "signature" is very different. Use this Such a signature can distinguish different data to a certain extent.
The common algorithms for generating signatures are: MD5 and SHA series
. Taking MD5 as an example, we don't need to study the specific calculation signature process, we only need to understand the characteristics of MD5:

Fixed length: No matter how long the string is, the calculated MD5 value is a fixed length (16-byte version or 32-byte version)

Dispersion: As long as the source string is changed a little, the final MD5 value will be very different.

Irreversible: It is easy to generate MD5 from the source string, but it is theoretically impossible to restore the original string through MD5.

Just because MD5 has such characteristics, we can think that if the MD5 values of two strings are the same, then the two strings are considered to be the same.

At the server stage, the MD5 value is generated for the content of the certificate as a signature, and then when the client receives the certificate, it generates MD5 for the content of the certificate at that time, and compares whether the signature is consistent with the MD5 value generated at this time. If not, it indicates the content of the certificate It has been tampered with. If it is consistent, it means that the content of the certificate is consistent with that of the server (it has not been tampered with during transmission), and you can safely use the public key in the certificate for subsequent operations.

However, this situation may occur. After the hacker gets the certificate, he modifies the content of the certificate, and recalculates the content of the signature to replace the signature with MD5. When the client verifies the certificate, it cannot detect whether the certificate has been Modified. There will be a problem at this time. How to solve it at this time?

Therefore, the transmitted signature cannot be transmitted in plain text, and cipher text transmission is also required, and symmetric encryption cannot be used, otherwise the above-mentioned problems will occur, so we use asymmetric encryption, so what about the public key and private key at this time? get it?

First of all, the private key can only be obtained when the server registers the certificate from the CA institution. The private key is not included in the certificate for transmission, so the server first encrypts the signature with the private key, and then transmits it to the client (even if After the hacker obtains the certificate and the public key from the CA, he decrypts and modifies the signature. At this time, the hacker cannot re-encrypt the signature, and the client can detect that the certificate has been tampered with). When it is transmitted to the client , the client obtains the public key from the CA to decrypt the signature, and compares the MD5 value of the certificate with the decrypted signature to check whether the certificate has been modified.

In this way we have solved all the problems. Below is the complete process.

4. Complete process

First, the client has built-in the public key 1 of the CA certificate, the server has applied for the certificate and obtained the private key 1 from the CA organization, and then the server has generated the public key 2 and the private key 2. The client sends a request to establish a connection, TCP The three-way handshake establishes the connection. Then the server puts the public key 2 into the certificate, and uses a hash function (such as MD5) to calculate the hash value of the certificate content as the signature of the certificate; and encrypts the signature with the private key 1. After that, the client decrypts the signature with the public key 1, and calculates the MD5 value of the certificate, and compares it with the MD5 value in the signature. If they are the same, it means that the content of the certificate has not been modified. Then the client generates a symmetric key and takes out the certificate The public key 2 in the symmetric key is encrypted and sent to the server. The server uses the private key 2 to decrypt the symmetric key. At this time, both the server and the client have obtained the same symmetric key. The transmitted data is encrypted using a symmetric key.

There are three groups of keys involved in the working process of HTTPS .

The first group ( asymmetric encryption ) : used to verify whether the certificate has been tampered with . The server holds the private key ( the private key is obtained when registering the certificate ), and the client holds the public key ( the operating system contains a trusted CA certification authority Which ones are there , and hold the corresponding public key at the same time ). The server uses this private key to encrypt the signature . The client obtains the signature of the certificate through decryption of this public key , so as to verify whether the content of the certificate has been tampered with .

The second group ( asymmetric encryption ): used to negotiate and generate symmetric encryption keys . The server generates this set of private key - public key pairs , and then passes the public key to the client through the certificate . Then the client uses this public key to generate The symmetric encryption key is encrypted and transmitted to the server , and the server obtains the symmetric encryption key by decrypting .

The third group ( symmetric encryption ): The subsequent data transmitted by the client and the server are encrypted and decrypted by this symmetric key .

In fact, the key to everything is around this symmetric encryption key . Other mechanisms are to assist this key to work .

The second set of asymmetric encryption keys is for the client to pass this symmetric key to the server .

The first set of asymmetric encryption keys is for the client to obtain the second set of asymmetric encryption public keys

The first set of private and public keys for asymmetric encryption is obtained from the CA organization,

The second set of private and public keys for asymmetric encryption is generated on the server side

The key for symmetric encryption is generated by the client

This process involves symmetric encryption, asymmetric encryption, and hash function. The hash function mainly generates a signature through the content of the certificate to verify whether the certificate has been modified.

Summary of the communication process:

1. TCP three-way handshake to establish a connection

2. TLS handshake negotiation key

3.Normal communication

Detailed explanation of HTTP protocol and HTTPS protocol

1. HTTP protocol

1. What is HTTP

2. HTTP development history

3. HTTP request and response

4. The method and tool of packet capture Fiddler

1. Developer Tools

2.Fiddler

2. Request and response

1. Request and response messages

2. URL structure

3. Common methods

1. GET method

2. POST method

3. Other methods

3. Request header (header)

1.Host

2.Content-Length

3.Content-Type

4.User-Agent(UA)

5. Refer

6.Cookie

Four. Response

1. Common status codes

1.200 OK

2. Response " header " (header)

5. Send POST and GET requests

1. Construct HTTP request through form form

1.GET

2.POST

2. Construct HTTP request through ajax

1.GET

2.POST

6. HTTPS

1. What is HTTPS

2. SSL/TLS protocol

3. Why does HTTPS appear?

4. Encryption and common encryption methods

1. Symmetric encryption

2. Asymmetric encryption

3. Hash function

5. What is a certificate

6. Workflow of HTTPS

1. Introduce symmetric encryption

2. Introduce asymmetric encryption

3. Import certificate

4. Complete process

Guess you like