Http

Http发送请求过程

如果访问过网页就先在浏览器缓存中查找，要注意缓存的过期时间，浏览器里会存放访问过的IP，就直接访问浏览器，没有IP就在dns查询IP再访问

GET POST

• 语义 get：获取数据 post :创建数据
• 发送数据 get 在请求头携带数据 post 既可以在请求头也可以在请求体携带数据
• 缓存 get 可以被缓存，post 不会被缓存
• 安全性 都不安全\

  Localstorage存入的键和值都是字符串类型

  jSON方法

  JSON.parse() 可以将JSON 格式的字符串解析成JS 中的对应值， 一定要是合法的JSON 字符串，否则会报错

JSON.stringify() 可以将JS 的基本数据类型、对象或者数组转换成JSON 格式的字符串

JSON内不能有undefined，要加双引号】

CORS

Access-ControlAllow-Origin: *
//表明允许所有的域名来跨域请求它，*是通配符,没有任何限制
Access-Control- Allow-Origin: http://127.0.0.1:5500
//只允许指定域名的跨域请求

使用CORS跨域的过程

//①浏览器发送请求

//②后端在响应头中添加Access-Control-Allow-Origin 头信息

//③浏览器接收到响应

//④如果是同域下的请求，浏览器不会额外做什么，这次前后端通信就圆满完成了

//⑤如果是跨域请求，浏览器会从响应头中查找是否允许跨域访问

//⑥如果允许跨域，通信圆满完成

//⑦如果没找到或不包含想要跨域的域名，就丢弃响应结果

JSONP

JSONP的原理

• script标签跨域不会被浏览器阻止
• JSONP主要就是利用script标签,加载跨域文件

使用JSONP实现跨域

• 服务器端准备好JSONP接口 https://wwwimooc.com/api/http/isonp?callback-handleResponse
• 手动加载JSONP接口或动态加载JSONP接口

  axios

fetch

• Fetch是Ajax (XMLHttpRequest) 的一种替代方案，它是基于Promise的
• Ajax的兼容性比Fetch好
  fetch的返回值

  body/bodyUsed  //body只能读一次, 读过之后就不让再读了
  ok  //如果为true,表示可以读取数据，不用再去判断HTTP状态
  码了
  

只能在请求体上加，如果要在请求头上加要在url上添加请求参数，如果body是对象格式，要用JSON.stringify转。content-type改为application/json，没有settimeout,abort.