网络URI、URL、URN 首先了解这几个概念： URI: Uniform Resource Identifier 即统

URI、URL、URN

首先了解这几个概念：

URI: Uniform Resource Identifier

即统一资源标识符，唯一的标识的一个资源

URL：Uniform Resource Locator

统一资源定位符。URL可以用来标识一个资源，而且还指明了如何定位这个资源

用地址定义一个资源

URN: Uniform Resource Name

统一资源命名。即通过名字来表示资源的

用名称定位一个资源

三者之间的关系：URL与URN是URI的子集，URL肯定是一个URI,URI并不一定是URL，也有可能是URN

https默认端口号443,,http默认端口号80

URI只是资源标识

URL特性：

资源标识
具备定位资源的功能(资源的具体位置)
指明了获取资源所采用的协议

构成：协议名称+主机名称+端口号+路径+文件+查询所需字符串

客户端与服务器

客户端：(Client)客户所使用的电脑中的应用程序

服务端：(Server)存放网页、客户端程序、数据处理程序、数据库的电脑

C/S架构与B/S架构

C/S(Client/Server)：将应用程序安装在客户端电脑中，由于服务端提供客户端所需的数据

优点：界面与操作丰富、安全性高、响应速度快

缺点：通常用于局域网、需要安装特定应用程序或使用特定硬件、维护成本高

B/S(Browser/Server)利用WEB浏览器呈现客户端程序界面，由于服务端提供客户端程序所需要的数据

优点：无需安装客户端程序与特定硬件、多客户访问、无需升级客户端

缺点：跨浏览器兼容性差、功能性相对较弱、设计成本高、安全性弱、功能性弱

域名(Domain Name)

域名的特点有以下几部分

相当于访问互联网某一户人家的地址
域名与服务器绑定以后，域名与服务器对应的IP是映射关系
域名比ip更方便用户记忆(域名可以是拼音或单词缩写)
IP可以对应多个域名，所以不同的域名可以访问一个或多个WEB网页

域名分类

域名的种类有多种，下面挑几种常见的介绍

通用类(展示中文域名-万网)

.com: 工商金融等企业.com.cn.公司
.gov: 政府机构.gov.cn
.net: 提供互联网网络服务机构.net.cn.网络
.org: 各类组织机构
.ac: 科研机构 .ac.cn
.edu: 教育机构 .edu.cn

WWW

www: 全称为World Wide Web,中文名为万维网

Internet提供了很多服务，其中包括WWW(网页服务)、FTP(文件传输)、E-mail(电子邮件)、Telnet(远程登录)等等。www是用浏览器访问网页的服务,所以网站的主页域名前需要加www。而随着网络服务类型的增加，不同的二级或三级域名对应不同的业务，而业务的处理任务会分配到多个服务器，所以，不再需要使用www来标注主页，很多网站都还会做DNS解析www。

DNS解析

DNS：Domain Name Server(域名服务器)

作用：域名与对应的IP转换的服务器

特征：

DNS中保存了一张域名与对应的IP地址的表
一个域名对应一个IP地址，一个IP地址可以对应多个域名

IP

英文：Internet Protocol Address

中文：互联网协议地址

作用：分配给用户上网使用的互联网协议

分类：IPv4、IPv6 其它

形式：192.168.0.1(长度32位(4个字节)，十进制表示) (IPv4)

IPv6相对于IPv4的优势：

IPv6地址空间更大(8组(128位)，十六进制)
路由表更小
对自动配置的支持
更高的安全性

IP端口号(port)

默认端口：http默认端口号为80，https默认端口号为443。

端口号范围：0 —— 65535

举个例子：当我们去游乐园玩时，咱可以把游乐园的地址看成是IP地址，游乐园的不同游乐设施看成端口号，找到一个IP就像找到了乐园的地址，相当于可以访问到IP所对应的服务器，IP加端口号，相当于去乐园玩不同的项目。总结为每一个端口对应的是一个服务器的一个业务，访问一个服务器的不同端口相当于访问不同的业务

TCP

TCP：英文名全称为Transmission Control Protocol,中文名称为传输控制协议

特点：面向连接(收发数据前，必须建立可靠的连接)

建立连接基础：三次握手

应用场景：数据必须准确无误的收发，HTTP请求、FTP文件传输、邮件收发

优点：稳定、重传机制、拥塞控制机制、断开连接

缺点：速度慢、效率低、占用资源、容易被攻击(三次握手会遭受DOS、DDOS攻击)

TCP/IP协议组：提供对点的连接机制，制定了数据封装、定址、传输、路由、数据接收的标准

UDP

UDP：英文全称为User Data Protocol,中文全称为用户数据协议

特点：面向无连接（不可靠的协议，无状态传输机制）

应用场景：无需确保通讯质量且要求速度快、无需确保信息完整(消息收发、语音通话、直播)

优点：安全、速度、漏洞少(UDP flood攻击)

缺点：不可靠、不稳定、容易丢包

总结：只要目的源、端口号、地址确定，则可以直接发送信息报文，但不能保证一定能收到或收到完整的数据

HTTP与HTTPS

HTTP: 英文全称为Hyper Text Transfer Protocol,中文名为超文本传输协议

定义：客户端和服务端请求和应答的标准，用于从WEB服务器传输文本到本地浏览器的传输协议

HTTP请求：按照协议规则先向WEB服务器发送的超文本传输到本地浏览器的请求

HTTPS：Hyper Text Transfer Protocol Secure 超文本传输安全协议

定义：HTTP的安全版(安全基础是SSL/TLS)

SSL： Secure Socket Layer(安全套接层)

TLS： Transport Layer Security(传输层安全)

为网络通信提供安全及数据完整性的一种安全协议，对网络连接进行加密

两者区别：

HTTP是不安全的(监听和中间人攻击等手段，获取网站账号信息和敏感信息)
HTTP协议的传输内容都是明文，直接在TCP连接上运行，客户端和服务端都无法验证对方身份
HTTPS协议的传输内容都被SSL/TLS加密，且运行在SSL/TLS上，SSL/TLS运行在TCP连接上，所以数据传输是安全的

建立TCP连接的前奏

标志位：数据包

SYN：Synchronize Sequence Numbers(同步序列编号)

ACK: Ackonwledgement (确认字符)

状态：

LISTEN:侦听TCP端口的连接请求

(我等着你发送连接请求呢)

SYN-SENT:在发送连接请求后等待匹配的连接请求

(我发送了连接请求，我等你回复哈)

SYN-RECEIVED:在收到和发送一个连接请求后等待对接请求的确认

(我收到你的连接请求了哈，我等你回复我)

ESTABLISHED:代表一个打开的连接，数据可以传送给用户

(建立了，我跟你说一下)

建立TCP的三次握手的总结

第一次握手：客户端向服务器发送SYN标志位（序列号J）,并进入SYN_SEND状态（等待服务器确认状态）

第二次握手：服务器收到来自客户端SYNJ，服务端会确认数据包已收到并发送ACK标志位（序列号J+1）和SYN标志位（序号K），服务器进入SYN_RECV（请求接收并等待客户端确认状态）

第三次握手：客户端进入连接建立状态后，向服务器发送ACK标志位（序号是K+1）确认客户端已收到建立连接确认，服务器收到ACK标志位后，服务端进入连接已建立状态

HTTP报文

HTTP基于TCP/IP通信协议来传递数据
HTTP基于客户端/服务端（C/S）架构模型
通过一个可靠的连接来交换信息，是一个无状态的请求/响应协议
限制每次连接只处理一个请求，服务器处理完客户的请求，并收到客户端的应答后，即断开连接，采用这种方式可以节省传输时间
只要客户端和服务器知道如何处理的数据内容，任何类型的数据都可以通过HTTP发送，客户端以及服务器指定使用合适的MIME-type内容类型
协议对于事务处理没有记忆功能，缺少转态意味着如果后续处理需要前面的信息，则它必须重传，这样可能导致每次连接传送的数据量增大。另一方面，在服务器不需要先前信息时它的应答就较快
HTTP报文定义：在客户端与服务器之间发送的数据块，这些数据块以一些文本的元信息（meta-information）开头，描述了报文的内容及含义，后面跟着可选的数据部分，这些报文在客户端、服务器和代理之间流动，所以HTTP报文的发送也叫报文流。每条HTTP报文包含一个客户端请求和服务端响应

报文的组成部分

对报文进行描述的起始行
包含属性的首部/头脑(header)
包含数据的主体(body)

HTTP报文基本格式

HTTP报文基本格式包括：请求行、请求头部、请求数据

请求行：请求行的结果包括请求方法+空格+URL+空格+版本协议+回车符+换行符

请求头部：请求头部由多个键值对组成，表现形式为：头部字段名：值+回车符+换行符，头部字段名：值+回车符+换行符...

HTTP报文请求方式

OPTIONS:返回服务器针对特定资源所支持的HTTP请求方法

HEAD: 返回与GET请求相一致的响应，响应体被返回

PUT: 向指定资源位置上传其最新内容(form表单不支持)。提交即存储的原则(无验证机制，安全漏洞)、需要配置服务器支持put方式转发给后端操作

DELETE: 请求服务器删除Request-URI所标识的资源(form表单不支持)。提交即存储的原则(无验证机制，安全漏洞)、需要配置服务器支持put方式转发给后端操作

TRACE: 回显服务器收到的请求，主要用于测试或诊断

CONNECT: 连接改为管道方式的代理服务器

GET/POST请求方式

案例展示

form表单GET/POST方式提交数据(AJAX提交数据)

总结：

GET主要用来获取数据;
GET的数据在请求体中是查询字符串参数(Query String Parameters);
POST主要用于传输数据到后端进行增加、删除、更新数据、提交表单;
POST的数据在请求体中是表单数据(Form Data);

区别：

POST更安全，不会最为url的一部分、不会被缓存、保存在服务器日志和浏览器记录中
POST发送的数据量更大(GET有url长度限制)
POST能发送更多的数据类型(各种类型的文件),
GET只能发送ASCII字符
POST比GET速度慢，POST请求包含更多的请求头；POST接收数据之前会先将请求头发送给服务器确认，然后发送数据
GET会进行数据缓存，POST不会
POST不能进行管道化传输

POST过程：

第三次握手，浏览器确认并发送post请求头
服务器返回状态码100后，continue响应
浏览器开始发送数据
服务器返回200OK响应

GET过程：

第三次握手，浏览器确认并发送请求头和数据
服务器返回200 OK响应

HTTP报文-状态码

1XX 信息，服务器收到请求，需要请求者继续执行操作

2XX 成功，操作被成功接收并处理

3XX 重定向，需要进一步的操作以完成请求

4XX 客户端错误，请求包含语法错误

5XX 服务器错误，服务器在处理请求的过程中发生了错误

304重定向

Etag：服务端资源唯一标识符(优先级高于Last Modified)

Last-modified:资源在服务器最后修改的时间(精确到秒),所以需要唯一标识符

举例子：

第一次访问index.html(响应头) 200 OK

Data: Sat, 05 Jan 2019 13:55:46 GMT

ETag: '144-57eb65254f380'

Keep-Alive: timeout=5, max=100

Last-Modified: Sat, 05 Jan 2019 13:53:34

第二次访问index.html(请求头) 304 Not Modified

If-Modified-Since: Sat, 05 Jan 2019 13:53:34

If-None-Match: "144-57eb65254f380"

第三次修改访问index.html(响应头) 200 OK

ETag: '148-57eb6616996cc0'

Keep-Alive: timeout=5, max=100

Last-Modified: Sat, 05 Jan 2019 13:57:47 GMT

If-Modified-Since: Sat, 05 Jan 2019 13:53:34 GMT

If-None-Match: '144-57eb65254f380'

302 重定向

服务端程序重定向,返回302Found

403 服务器拒绝请求forbidden

404 页面错误(页面不存在)

500 Internal Server Error 服务器发生不可预测的错误

503 server Unavailiable 服务器当前不能处理客户端请求(关闭应错或者程序池队列已满)

HTTP报文-ACCEPT & CONTENT-TYPE

Accept: 代表客户端希望接收的类型

Accept(请求头)类型：

text/html,

application/xhtml+xml,

application/xml

Content-Type(响应头)

Content-Type: text/html;charset=UTF-8(Accept-Charset) 返回的资源类型与编码

*：通配符, */*任意类型

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

浏览器支持的语言是简体中文、其次是美国英语、再其次是其它形式的英语

Content-Language:zh-CN

说明返回资源的语言类型

Accept-Encoding

Accept-Encoding: gzip, deflate, br

浏览器可以接收的资源编码格式(压缩格式)

Content-Encoding

Content-Encoding: gzip

服务器返回的资源的编码格式(压缩格式,优化传输内容的大小)

浏览器缓存

把已请求并返回的WEB资源(HTML页面、图片、js文件、CSS文件、数据等)复制成一个副本存储在浏览器的缓存中

缓存的好处:

减少网络带宽的消耗
降低服务器压力
减少网络延迟

Pragma: no-cache(响应头)

指示浏览器忽略资源缓存副本,每次访问需要到服务器获取

http1.0中字段，http1.1用Cache-Control替换(http协议向下兼容，所以很多网站依旧有这个字段)

Cache-Control 缓存控制

no-cache: 指示浏览器忽略资源缓存副本，强制到服务器获取资源(浏览器依旧缓存)

no-store: 强制缓存在任何情况下都不要保留任何副本

max-age: 指示缓存副本的有效时长，从请求时间开始到过期时间之间的秒数

public: 表明响应可以被任何对象(包括：发送请求的客户端，代理服务器，等等)缓存

private: 表明响应只能被单个用户缓存，不能作为共享缓存(即代理服务器不能缓存它)

Expires: 启用缓存和定义缓存时间。告诉浏览器资源缓存过期时间，如果还没过该时间点则不发请求。在HTTP1.1版开始，使用Cache-Control:max-age=秒替换

当浏览器在有缓存的情况下发起请求，首先判断请求是否过期，如果不过期，在disk cache读取缓存(200 OK),接着呈现页面。如果过期了，要进行Etag和Last-Modified验证，Etag优先级高于Last-Modified，先验证Etag,一致的情况下才验证Last-Modified。若不通过，重新发送请求，再次响应缓存呈现页面。若通过，向服务器请求发送If-None-Match/If-Modified-Since,接着判断状态码，状态码为200，则响应缓存，接着呈现页面。状态码为304，读取缓存304 Not Modified直接呈现页面

CONNECTION: KEEP-ALIVE

HTTP短连接与长连接

短连接：所谓短连接，就是每次请求一个资源就建立连接，请求完成后连接立马关闭

建立TCP连接->请求资源->响应资源->断开连接

长连接

只建立一次连接，多次资源请求都复用该连接，完成后关闭

建立TCP连接->请求1->响应1->请求2->响应2->...->断开连接

在早期HTTP1.0，每个HTTP请求都要创造一个TCP/IP连接，后勤的HTTP/1.0，在请求头增加:Connection: keep-alive

HTTP/1.1

默认开启：Connection: keep-alive

如需关闭：Connection: close

注意：Connection: keep-alive在大多数浏览器中都默认使用HTTP/1.1;服务器也必须由相应的支持才能达成C/S/协议进行长连接

CONTENT-LENGTH

Content-Length用于描述HTTP消息实体的传输长度

REFERER

Referer(来源域名):Referer是request headers的一部分，当浏览器向web服务器发送请求的时候，一般会带上Referer,告诉服务器我是从哪个页面链接过来的。

好处：可通过Referer分析不同渠道的流量分布、用户搜索的关键词

HTTP协议版本

HTTP/0.9

仅支持GET请求方式

仅能请求访问HTML格式的资源

HTTP/1.0

增加POST和HEAD请求方式

支持多种数据格式的请求和访问

支持cache缓存功能

新增状态码、多字符串支持、内容编码等

早期HTTP/1.0不支持keep-alive长连接，只支持串行连接

后期HTTP/1.0增加Contention:keep-alive字段(非标准字段)，开始支持长连接

HTTP/1.1

增加持久连接(默认开启Connection:keep-alive)

增加管道机制(支持多个请求同时发送)

增加PUT/PATCH/OPTION/DELETE等请求方式

增加Host字段(指定服务器域名)

增加100状态码(Continue),支持只发送头信息

增加身份认证机制

支持传送内容的一部分和文件断点续传

新增了24个错误状态码

HTTP2.0

增加双工模式(客户端同时发送多个请求，服务端同时处理多个请求)

服务器推送(服务器会把客户端需要的资源一起推送到客户端，合适加载静态资源)

头信息压制机制(每次请求都会带上所有信息发送给服务端[HTTP协议不带状态])

二进制协议(头信息与数据媒体使用二进制进行传输)

多工(先发送已处理好的部分，再响应其他要求，最后再解决没有处理好的部分)

关闭TCP连接的前奏

状态：

FIN-WAIT-1：等待远程TCP的连接中断请求，或先前的连接中断请求的确认

FIN-WAIT-2: 从远程TCP等待连接中断请求

CLOSE-WAIT: 等待从本地用户发来的连接中断请求

LAST-ACK：等待原来发向远程TCP的连接中断请求的确认

TIME-WAIT: 等待足够的时间以确保远程TCP接收到连接中断请求的确认

CLOSED: 没有任何连接状态

关闭TCP的四次挥手的总结

1.客户端发送连接关闭报文(此时已停止发送数据)(第一次挥手)

报文首部：FIN=I(序列号seq=u)

此刻: 客户端进入终止等待I(FIN-WAIT-1)状态

2.服务器收到连接关闭报文，并发送确认报文（第二次挥手）

报文首部：ACK=I (确认FIN) (序列号seq=v)

说明：连接半关闭状态，客户端没有数据要发送，但服务器如果还要发送数据，客户端依然需要接受

3.客户端收到服务器的确认请求后，客户端进入终止等待2(FIN-WAIT-2)状态

(服务器在这期间还要确认客户端所需要的数据是否真的发送完毕了，如果还发送完，则继续发送数据)

4.服务器确认数据已发送完毕后，向客户端发送连接关闭报文(第三次挥手)，服务器进入最后确认(LAST-ACK)状态

报文首部：FIN=I ACK=I ack=u+I(确认上一次数据包)序列号seq=w

5.客户端收到服务器的连接关闭报文后，发出接收确认报文(第四次挥手)，客户端进入时间等待(TIME-WAIT)状态

报文首部：ACK ack=w+I(确认上一次数据包)序列号seq=u+I

6.服务器收到客户端发出的确认，立即进入TCP关闭状态(CLOSE),TCP连接结束(TCP关闭，服务端要比客户端早一些)

TIME-WAIT时长：2MSL Maximum Segment Lifetime最大报文生存时间

MSL的值根据不同的情况而不同，一般是30秒，1分钟，2分钟

目的：保证客户端发送的最后一个报文能够发送到服务器，一旦报文丢失，服务器会认为最后一次发送的FIN+ACK包，客户端并没有收到，此时，服务器会重新发送一次FIN+ACK包，而客户端可以在2MSL的TIME-WAIT时间内收到重新传输的FIN+ACK包，接着重新进行第四次挥手，并重启2MSL计时器

为什么是四次挥手

原因：第一次挥手的时候发送了FIN包，服务器接收后，表示客户端不再发送数据了,但还能接收数据。这时服务器先向客户端先发送确认后，并且确认自己是否还有数据没有发送给客户端，这个确认的阶段是CLOSE-WAIT,所以在终止等待1(CLOSE-WAIT)的开始和结束需要发送一个包，状态开始时向客户端发送的包是确认收到来自客户端的FIN包，状态结束时向客户端发送的是确认数据已经完整发送，所以是四次挥手

同源策略(Same-Origin-Policy)

web浏览器只允许在两个页面有相同的源时，第一个页面的脚本访问第二个页面里的数据

同源策略是浏览器的一个安全功能，不同源的客户端脚本在没有明确授权的情况下，不能读写对方资源，只有同一个源的脚本富裕dom、session、ajax等操作的权限

不受同源策略限制的项：

页面的超链接
重定向页面
表单的提交
资源引入(script src/link href/img src/ iframe src)

AJAX前奏

AJAX：Asynchronous JavaScript and XML异步的JavaScript和XML

前言

浏览器与服务器之间的通讯基础是HTTP协议
用户通过网址或表单向服务器提交请求，服务器向浏览器发送相应的响应

原生XMLHttpRequest对象与ActiveX对象

作用：

JS脚本HTTP请求的发起必须通过XMLHttpRequest对象

也就是通过AJAX进行浏览器与服务器通信的接口;不局限于XML，可以发送任何格式的数据

XMLHttpRequest本身是一个JS引擎内置的构造函数,所有XMLHttpRequest对象都需要被实例化var xhr = new XMLHttpRequest(),为了对IE5/IE6的兼容，使用ActiveXObject对象，实例化过程var xhr = new ActiveXObject('MicrosoftXMLHTTP')

AJAX发送HTTP请求

open方法(method，url, async)

参数列表

method: 请求方式

url: 请求发送的地址

async: true异步 false同步

send方法(发送请求)

参数POST请求体数据需要，GET不需要

AJAX发送请求时的响应任务

onreadystatechange事件：挂载到XMLHttpRequest对象上的事件

status状态：服务器响应的状态码(200 OK、 404未找到页面)

readyState状态：通过XMLHttpRequest对象发送HTTP请求的各阶段状态码(0-4),当readyState变化时，将触发onreadystatechange事件执行其回调函数，readyState的值表示：0为请求未初始化，1为服务器连接已建立，2请求已接收，3请求处理中，4请求已完成，且响应已就绪。注意的是readyState仅仅是针对请求的状态码，获取资源是否成功取决于status的状态

responseText: 获取字符串数据

responseXML: 获取XML数据

AJAX-POST请求方式的注意事项

在POST请求方式下，send方法参数中格式为：a=1&b=2&c=3,所以POST请求方式必须设置这个请求信息,setRequestHeader('Content-Type','application/x-www-form-urlencode')，目的是请求体中的数据转换为键值对，这样才知道这是一个POST方式传来的数据。

AJAX-状态码与状态提示

xhr.status/xhr.statusText: 服务器回应的HTTP状态码/服务器发送的状态提示

200 OK，访问正常

301 Moved Permanently 永久移动

302 Move temporarily 暂时移动

304 Not Modified 未修改

307 Temporay Redirect 暂时重定向

401 Unauthorized 未授权

403 Forbidden 禁止访问

404 Not Found 为发现指定网址

500 Internal Server Error 服务器发送错误

AJAX-五个事件

xhr.onloadstart: 绑定HTTP请求发出的监听函数

xhr.onerror: 绑定请求失败的监听函数(修改封装的AJAX)

xhr.onload: 绑定请求成功完成的监听函数

xhr.onabort: 绑定请求中止(调用了abort()方法)的监听函数

xhr.onloadend: 绑定请求完成(不管成功与失败)的监听函数

AJAX-请求超时

xhr.timeout 多少毫秒后，如果请求仍然没有得到结果，就会自动终止，如果该属性等于0就表示没有时间限制

xhr.ontimeout 绑定请求超时一个监听函数，如果发生timeout事件，就会执行这个监听函数

AJAX-异步与同步

async的值

异步(默认)(async=true): Ajax异步发生请求时，不影响页面加载、用户操作以及AJAX程序后的程序执行

同步(async=false): Ajax同步发送请求时，浏览器必须等到请求完成并响应成功后，AJAX程序后续的程序才会执行

网络

URI、URL、URN

客户端与服务器

域名(Domain Name)

域名分类

WWW

DNS解析

IP

IP端口号(port)

TCP

UDP

HTTP与HTTPS

建立TCP连接的前奏

建立TCP的三次握手的总结

HTTP报文

报文的组成部分

HTTP报文基本格式

HTTP报文请求方式

GET/POST请求方式

HTTP报文-状态码

HTTP报文-ACCEPT & CONTENT-TYPE

浏览器缓存

Pragma: no-cache(响应头)

Cache-Control 缓存控制

CONNECTION: KEEP-ALIVE

HTTP/1.1

CONTENT-LENGTH

REFERER

HTTP协议版本

关闭TCP连接的前奏

关闭TCP的四次挥手的总结

为什么是四次挥手

同源策略(Same-Origin-Policy)

AJAX前奏

相关历史：

原生XMLHttpRequest对象与ActiveX对象

AJAX发送HTTP请求

AJAX发送请求时的响应任务

AJAX-POST请求方式的注意事项

AJAX-状态码与状态提示

AJAX-五个事件

AJAX-请求超时

AJAX-异步与同步