前端应该掌握的web基础和网络知识

* 关于HTTP协议

http协议是www服务器和用户请求代理之间通过应答模式来传输超文本内容的一种协议，它是基于请求与响应、无状态、应用层的一种协议。大多数的web应用都建立

在http协议的基础之上。

***********************************************************

http的工作流程：

在进行http协议会话的过程中，首先会有一个Tcp/ip连接的过程，客户端与服务器端会通过socket三次握手建立连接；

建立连接成功之后，客户端向服务器端发送请求报文；（发送数据）

服务器端处理请求，并返回响应报文作出应答；

服务器断开Tcp连接，如果服务器端或客户端头部包含有connection为keep-alive的头域信息，客户端与服务器端会继续保存连接，在下次请求时会使用这次的连接。

***********************************************************

在HTTP 1.1协议中，任何http请求的报文头部域中都默认包含了keep-alive头域信息，所以基于http1.1协议的请求连接在一段时间内都是持续有效的；

在HTTP1.0协议中，虽然默认请求的服务器返回是没有keep-alive，但是如果要基于http1.0协议建立长连接，可以在请求消息中包含connection为keep-alive的头

域信息。

建立长连接的好处是可以减少文件请求建立连接和关闭连接产生的额外开销。

***********************************************************

HTTP请求报文和响应报文的格式：

一个完整的http报文由头部、空行、正文组成。

空行主要是用于区分报文头部和报文正文。

请求报文头部由请求类型、请求uri、协议版本构成，请求头部中包含其他请求头部域信息如：cookie、accept、cache-control、host等，

请求正文包含浏览器端请求的内容，如post、put请求的表单内容。

响应报文头部由状态码、状态描述、协议版本构成，响应头部包含的响应头部信息如：date、content-type、cache-control、expires等，

响应正文包含服务器返回给浏览器端的内容。

***********************************************************

HTTP请求的方法：

get：一般用于向服务器端请求数据，也可以通过url向服务器传输数据

post： 一般用于向服务器端传输数据

delete：删除指定uri位置的文件

put：传输文件，将文件内容保存到指定uri的位置，报文正文中包含文件内容

head：获取报文首部，与get类似，但是不返回报文主体，一般用于验证uri是否有效

options：查询相应uri支持的http方法

***********************************************************

get与post的区别：

get一般用于获取服务器端资源，post一般用于向服务器端发送数据。

在向服务器端传输数据的方式不一样，get是通过在url后面加上？加上键值对的形式向后端传输数据，而post是将数据包含在http包体里面向后端传输的。

get方式因为是在地址栏上向后端传输数据，所以传输数据是有限的，而post方式传输数据是没有限制的，可以向后端传大量的数据。

get方式因为传输的数据暴露在地址栏，用户是可见的，post方式传输的数据对用户不可见，安全性比get方式要好。

***********************************************************

常见头部域字段：

通用头部字段：

date 消息发送时间

cache-control指定客户端和服务器遵循的缓存机制

pragma：同cache-control一致

connection允许客户端或服务器端任何一方通过设置该字段来确定在请求响应完成之后，是关闭TCP连接还是继续保持TCP连接

upgrade用来指定完全不同的通信协议

content-type：消息类型

content-length： 消息长度

content-encoding：消息的压缩类型

expires： 设置资源的缓存时间

请求报文包含的字段：

accept：浏览器能够处理的内容类型

accept-ecoding： 浏览器能够处理的压缩编码

accept-charset： 浏览器能够处理的字符集

accept-language： 浏览器当前设置的语言

host： 当前页面所在的域

referer： 发出请求的页面的uri

use-angent： 浏览器的用户代理字符串

cookie

authorization： 授权信息

if-none-mach

if-modified-since

响应报文包含的字段：

set-cookie

ETag: 缓存有关的头

Last-modified: 请求资源的最后修改的时间

***********************************************************

常见状态码：

1xx: 信息性状态码，表示服务器接收到请求正在处理；
2xx: 成功状态码，表示服务器正确处理完请求；
3xx: 重定向状态码，表示请求的资源位置发生改变，需要重新请求，301永久重定向，302临时重定向；
4xx: 客户端错误状态码，服务器无法处理该请求。 404 not found，400 bad request；
5xx: 服务器错误状态码，服务器处理请求出错。500 Internal Server；

***********************************************************

* 关于缓存

禁止浏览器缓存资源的方式：

将expires设置为0或-1

cache-control设置为 no-cache

pragma设置为no-cache

***********************************************************

* 关于客户端存储：

cookie的结构： cookie中的变量通过"属性=值"的形式保存

响应的cookie保存在set-cookie字段里面

字段的组成：

名称： 唯一标识cookie

值

有效时间： cookie的过期时间

域： cookie在哪些域下有效

路径： 指定域下的那个路径，在向服务器发送请求时，要发送cookie

安全标示：cookie只有在使用ssl连接的时候才发送给服务器

名称和值是必须有的字段，且必须被URL编码（encodeURIComponent编码）

***********************************************************

cookie的限制：

cookie绑定在特定的域名下，在创建了cookie之后，在给创建它的域名发送请求时，都会包含这个cookie。

将cookie绑定在特定域下，是出于安全性考虑，确保cookie中的信息只有批准的接受方才能访问。

每个域下的cookie总数是有限的，不同的浏览器之间各不同，有的浏览器下没有限制，有的每个域下最多50个cookie，有

的30个cookie。

***********************************************************

为什么要限制每个域下cookie数量：

因为cookie是存在客户端的计算机中，有限制是为了确保cookie不会被恶意使用，同时不会占用太多内存。

cookie在不设置过期时间时默认生命周期为会话时间，cookie存在内存中；设置过期时间，cookie存在计算机的磁盘中。

***********************************************************

cookie的应用场景以及安全问题：

记录用户的登录状态、用户的浏览信息等

***********************************************************

为什么要有cookie和session：

http协议是无状态的，对事务处理没有记忆功能；cookie和session的存在是为了用于客户端的状态管理。

例如：记录用户的登录状态，将用户的用户名和密码通过加密之后存在cookie中。

***********************************************************

为什么要限制cookie大小：

因为cookie会通过http请求发送给服务器，cookie越小对传输性能的影响就越小。

***********************************************************

cookie与session的区别：

***********************************************************

cookie、localstorage、sessionstorage的区别：

***********************************************************

* 什么是同源策略，为什么要有同源策略

同源策略主要针对的是通过XHR实现的ajax通信

一个XHR对象只能访问与包含它的页面处在同一域中的资源

***********************************************************

* 跨域

***********************************************************

* 从输入网址到页面呈现内容这个过程中都发生了什么

***********************************************************
* 浏览器如何加载、解析、渲染页面
***********************************************************
* 前端安全： xss和csrf