我邂逅青训营的第五天之回调http协议地狱 | 青训营笔记

82 阅读2分钟

这是我参与「第五届青训营 」伴学笔记创作活动的第5天

不能击败我的,只会让我变得更强大

一、http协议

(一)初识http

  1. 用户输入信息,浏览器内核处理并返回渲染好的页面 image.png
  2. 网络模型.

l  应用层

l  传输层

l  网络层

l  数据链路层 

  1. 应用层中的http

l  Hyper Text Transfer Protocol超文本传输协议

l  可扩展简单

l  无状态

l  应用层技术,基于TCP image.png

二、协议分析

(一)发展

从简单到复杂 image.png (二)报文

1.Method image.png 2.例如get方法是比较safe的 image.png 3.状态码 image.png 4.RESTful API

image.png 一种API设计风格;REST:representationnal State Transfer

5.常用请求头

例如提交的表单内容就是实体内容,Content-Type就是对应的类型 image.png 6.常用响应头 image.png (1)缓存 强缓存和协商缓存 image.png 7.cookie

(1)Set-Cookie-response

8.https(Hypertext Transfer Protocol Secure)

在http基础上加密  

(三)应用场景分析

1.场景分析-静态资源

(1)缓存策略是怎样的?

l  强缓存

l  Cache-control:一年

(2)额外的信息

l  允许所有域名访问

l  资源类型:css

(3)静态资源方案

缓存+CDN+文件名hash

CDN:Content Delivery Network

通过用户就近性和服务器负载的判断,CDN确保内容以一种极为高效的方式为用户的请求

供服务

(4)跨域

1)预请求:获知服务端是否允许该跨源请求

 网址组成:Scheme host name port

image.png 2)跨域解决方案

插入代理服务器

 同源策略是浏览器的安全方案

(5)登录

为什么下一次页面能记住上次的登录态?

1)cookie+Session

例如浏览器可以保存输入的账号密码,下次登录时自动输入

2)JWT(JSON web token) 

三、HTTP协议实战分析

(一)实战浏览器篇

1.AJAX之XHR

XmlHttpRequest

2.AJAX之Fetch

l  XMLHttpRequest的升级版

l  使用promise

l  模块化设计、response、request、Header对象

看到了http协议,我就知道我未学的计算机网络是文科