1.http 基础概念
2. 请求与响应过程
3. 请求头响应头及请求方式简述
4. 客户端缓存 (cookie,session 及其他缓存机制)
1. 什么是 http????
HTTP 是一套计算机通过网络进行通信的规则使 HTTP 客户 (如 web 浏览器) 能够从 HTTP 服务器 (Web 服务器) 请求信息和服务, HTTP 是一种无状态的协议
1.1 无状态的协议
无状态是指 Web 浏览器和 Web 服务器之间不需要建立持久的连接,
这意味着当一个客户端向服务器端发出请求, 然后 Web 服务器返回响应 (response), 连接就被关闭了
2. 一次完整的 http 请求
域名解析:
(1) 浏览器首次搜索自身的 DNS 缓存, 检查自身的缓存 (缓存时间大概为 几分钟) 中有没有相应的域名 IP 地址如果有, 则检查是否过期, 如果没有过期, 那么将结果返回并结束域名解析的过程; 否则, 往下执行;
(2) 在浏览器自身没找到 IP 地址的话, 浏览器就会在操作系统搜索 DNS 缓存如果存在, 同样需要检查是否过期;
(3) 如果操作系统中也没有找到, 那么就读取本地的 HOST 文件 (在 C 盘下: Windows\System32\drivers\etc), 在本地文件里面查找;
(4) 如果在本地 HOST 文件下也没能找到, 那么浏览器发起一个 DNS 的系统调用过程如下:
宽带运营商服务器查看本地缓存, 如果找到就结束该过程, 否则继续执行;
宽带运营商服务器代替浏览器发起一个迭代 DNS 的请求: 首先找到根域的 DNS IP 地址拿到顶级域 COM 域的 IP 地址; 接着在 COM 域服务器的地址中寻找主域名 (如: imooc.com) 的 DNS 服务器的地址; 最后在主域名 DNS 服务器中找到请求的域名的 IP 地址, 主域名 DNS 服务器就将该地址发送给运营商服务器这个时候运营商服务器将结果返回给操作系统内核, 然后内核从操作系统 DNS 服务器上拿去 IP 地址并返回给浏览器, 最后就是浏览器拿到了请求域名的 IP 地址
( 1 ) 建立 TCP 连接
三次握手 建立连接
( 2 ) 浏览器向服务器发送请求命令
( 3 ) 服务器响应
( 4 ) Web 服务器关闭 TCP 连接
请求方式:
GET
GET 是 http 的默认请求方式, 一般用来获取数据, 传输的数据经过 url 编码后放在路径? 之后, 多个键值对通过 & 连接, 另外 get 的传输长度一般不推荐超过 255 个字节
GET 方法一般被视为安全方法, 因为它仅用来获取数据而不会对服务器有其他改动像 HEADGETOPTIONS 和 TRACE 这几种 http 方法是被认为是安全的, 它们只会进行获取数据而不会修改服务器的状态, 可用于记录日志创建缓存或者创建其他统计信息相反, 像 POSTPUTDELETE 和 PATCH 等方法是有可能产生副作用网络爬虫等一般不会使用这些方式
POST
POST 一般用来上传文件或者提交一个完整的 web 表单浏览器中提交表单时, 这里与 get 类似, 每个键值对都是通过 & 分割, 其他非字母数字会进行 url 转码
其他请求方式
HEAD 获取某个 URI 响应头信息, 基本与 GET 相同但是不返回响应主体
PUT 通过提供的 URI 获取到特定的内容主体, 如果存在则修改内容, 如果不存在则创建
DELETE 通过 URI 删除指定内容
TRACE 返回接受到的请求, 用来查看数据经过中间服务器时发生了哪些变动
OPTIONS 返回给定 URL 支持的所有 HTTP 方法, 这样可以用来检查 web 服务器的功能
CONNECT 要求使用 SSL 和 TLS 进行 TCP 通信
PATCH 请求修改局部数据
这些请求方法本质上没有区别, 最终都是 TCP 请求, 唯一的区别就是每个请求方法, 使用的时候, 规范规定的使用格式不同, 原则上必须按照规范规定的格式使用, 其实也可以违反规范使用, 比如你可以使用 GET 方法请求数据, 也可以使用 GET 方法提交数据, 当然你可以用 POST 方法提交数据, 也可以用 POST 方法获取数据
下面是 Chrome 发起的 http 请求报文头部信息:
clipboard3.png
Accept 就是告诉服务器端, 我接受那些 MIME 类型
Accept-Encoding 接受哪些压缩方式的文件
Accept-Lanague 告诉服务器能够发送哪些语言
Connection 告诉服务器支持 keep-alive 特性
Cookie 每次请求时都会携带上 Cookie 以方便服务器端识别是否是同一个客户端
Host 用来标识请求服务器上的那个虚拟主机, 比如 Nginx 里面可以定义很多个虚拟主机.那这里就是用来标识要访问那个虚拟主机
User-Agent 用户代理, 一般情况是浏览器, 也有其他类型, 如: wget curl 搜索引擎的蜘蛛等
安全请求首部:
Authorization: 客户端提供给服务器的认证信息;
accessToken: 一般作为请求操作时的访问令牌, 比如你让用户用 QQ 登陆后要去拿用户的 QQ 头像, 这时候向腾讯 API 发送请求时就需要带上 access_token
响应头:
clipboard4.png
Access-Control-Allow-Credentials: 允许跨域
Access-Control-Allow-Headers: 允许访问的请求头
Access-Control-Allow-Methods: 请求方式
Access-Control-Allow-Origin: 域名
Access-Control-Expose-Headers:
Transfer-Encoding:chunked 分块传输编码 是 http 中的一种数据传输机制, 允许 HTTP 由网页服务器发送给客户端应用 (通常是网页浏览器) 的数据可以分成多个部分
拓展:(WebSocket) 有状态
需要通过浏览器发出 websocket 连线请求, 然后服务器发出回应, 浏览器和服务器之间就形成了一条快速通道两者之间就直接可以数据互相传送
特点: 持久的连接
互相沟通的 Header 是很小的 - 大概只有 2 Bytes
服务器不再被动的接收到浏览器的请求之后才返回数据, 而是在有新数据时就主动推送给浏览器
webSocket api
创建 webSocket 对象
var Socket = new WebSocket(url, [protocol] );// 第一个参数 url, 指定连接的 URL 第二个参数 protocol 是可选的, 指定了可接受的子协议
方法:
QQ 截图 20180114160210.png
详细了解 参考资料 (https://www.zhihu.com/question/20215561)
浏览器存储机制
cookielocalstoragesessionStorage
clipboard.png
cookie 的内容主要包括: 名字值过期时间路径和域
Secure 安全
指定 cookie 的值通过网络如何在用户和 WEB 服务器之间传递
这个属性的值或者是 secure, 或者为空缺省情况下, 该属性为空, 也就是使用不安全的 HTTP 连接传递数据如果一个 cookie 标记为 secure, 那么, 它与 WEB 服务器之间就通过 HTTPS 或者其它安全协议传递数据不过, 设置了 secure 属性不代表其他人不能看到你机器本地保存的 cookie 换句话说, 把 cookie 设置为 secure, 只保证 cookie 与 WEB 服务器之间的数据传输过程加密, 而保存在本地的 cookie 文件并不加密如果想让本地 cookie 也加密, 得自己加密数据
Web Storage 的概念和 cookie 相似, 区别是它是为了更大容量存储设计的 Cookie 的大小是受限的, 并且每次你请求一个新的页面的时候 Cookie 都会被发送过去, 这样无形中浪费了带宽, 另外 cookie 还需要指定作用域, 不可以跨域调用
除此之外, Web Storage 拥有 setItem,getItem,removeItem,clear 等方法, 不像 cookie 需要前端开发者自己封装 setCookie,getCookie
最主要的区别:
localStorage 生命周期是永久, 这意味着除非用户显示在浏览器提供的 UI 上清除 localStorage 信息, 否则这些信息将永远存在
sessionStorage 生命周期为当前窗口或标签页, 一旦窗口或标签页被永久关闭了, 那么所有通过 sessionStorage 存储的数据也就被清空了
Cache
1.Application Cache
html5 提供的一种应用缓存机制, 使得基于 web 的应用程序可以离线运行优点有如下几点:
离线浏览: 用户可以在离线状态下浏览网站内容
更快的速度: 因为数据被存储在本地, 所以速度会更快
减轻服务器的负载: 浏览器只会下载在服务器上发生改变的资源
使用:
1. 开启应用缓存: 在 html 标签制定 manifest,manifest 特性与 缓存清单 (cache manifest) 文件关联, 这个文件包含了浏览器需要为你的应用缓存的资源 (文件) 列表
clipboard1.png
2. 编写缓存清单文件
clipboard2.png
CACHE:
这是缓存文件中记录所属的默认段落在 CACHE: 段落标题后 (或直接跟在 CACHE MANIFEST 行后) 列出的文件会在它们第一次下载完毕后缓存起来
NETWORK:
在 NETWORK: 需要与服务器连接的白名单资源所有类似资源的请求都会绕过缓存, 即使用户处于离线状态可以使用通配符 * 代表除以上指定之外全部需要从服务器拉取
FALLBACK:
FALLBACK: 段指定了一个后备页面, 当资源无法访问时, 浏览器会使用该页面该段落的每条记录都列出两个 URI 第一个表示资源, 第二个表示后备页面两个 URI 都必须使用相对路径并且与清单文件同源可以使用通配符, 类似 404.html
CACHE, NETWORK, 和 FALLBACK 段落可以以任意顺序出现在缓存清单文件中, 并且每个段落可以在同一清单文件中出现多次
来源: http://www.jianshu.com/p/3e38e0cf396f