web前端-http

112 阅读4分钟

跨域

为什么跨域原因

  • 浏览器的同源策略:确保一个应用中的资源只能被本应用的资源访问(协议名,域名,端口号想同),服务器返回的信息被浏览器拦截了
  • 防范CSRF的攻击
  • 前后端分离开发的模式下,前后端的域名不一致,此时就会发生跨域访问的问题

方案

  • JSONP 浏览器中插入一个script标签,向服务器请求json数据,这种做法不受同源政策影响,服务器收到请求以后将数据放在一个指定名字的回调函数里面传回来。script支持src参数
  • websocket

https超文本传输安全协议

  • 加密技术
  • 身份验证

优点

  • https协议是由http和ssl协议构建的可进行加密传输和身份认证的网络协议,比http协议的安全性更高 https协议是由http和ssl协议构建的可进行加密传输和身份认证的网络协议,比http协议的安全性更高

缺点

  • https比http耗费更多的服务器资源(本质上就是建构在SSL/TLS上面的http协议)
  • ssl证书要钱
  • 页面加载时间延长
  • 缓存更大

工作原理

  • 客户使用https url访问服务器,要求web服务器建立ssl链接
  • web服务器接收到客户端请求以后,会将网站的证书(证书包含了公钥),返回给客户端
  • 客户端和服务器端开始协商ssl链接的安全等级,也就是加密等级
  • 客户端(浏览器)根据双方协商一致的安全等级,建立会话密钥,然后通过网站的公钥来加密会话密钥,并传送给网站
  • web服务器通过自己的私钥解密出会话密钥
  • web服务器通过会话密钥加密与客户端之间的通信

HTTP无状态

http(超文本传输协议),规定了浏览器与万维网服务器之间互相通信的规则,是基于TCP/IP协议进行,是无状态的,一旦数据传输结束就会断开,无法获取状态。
http是面向连接的,如果连接没有中断,可以继续发送请求而不必重新建立TCP连接

url结构

底层协议+服务器域名+资源路径+发送的服务器参数+锚点

http消息结构

  • 请求头(request header)
  • 响应头(response header)

cookie(会话跟踪技术)

在每一次会话中记录一些状态,全程跟踪记录客户端状态

  • 只能储存文本,保存在客户端
  • 单条数据存储有大小限制(4kb)
  • 数量限制(50条)
  • 不能跨域读取(同源共享)
  • 浏览器端生成的cookie默认关闭的时候即失效,有效时间一般由服务器生成,可设置失效事件
  • 路径限制(外层不能访问内层,内层可以访问外层)

cookie能够追踪并记录你的网络浏览行为,当你下一次访问该网页的时候分析你电脑上的cookie,进而采取措施返回更符合你个性化的网页。
敏感数据不要放在cookie,容易被攻击

http缓存图解

第一次请求

非第一次请求

强缓存Cache-Control,直接返回缓存

对比缓存(拥有缓存标识)

  • etag(服务器端生成唯一标识)优先级更高
  • Last-Modified/If-Modified-Since,返回给客户端最后这个资源的修改时间
    第一次请求的时候,返回给客户端数据和缓存的信息,也就是一个特定的缓存标识,客户端把这个缓存标识存放到缓存数据库里面,再次请求的时候客服端把缓存标识也一起发给服务器进行对比,服务器根据缓存标识进行判断。
    判断成功后,返回304通知客户端比较成功,可以使用缓存数据。
    总结:
    强制缓存的优先级更高,如果没失效,就直接使用缓存数据库里面的东西,如果时间已经失效了以后,就看使用的是哪一种标识,返回304重定向就使用缓存数据,返回200就返回新的body和新的请求头。
    两类缓存规则可以同时生效,强制缓存优先级要高于对比缓存,当执行强制缓存规则的时候,如果缓存生效,则直接使用缓存,不再执行对比缓存规则。

本地存储localstorage

  • 没有时间限制
  • 以键值对存储,永久储存,永不失效,除非手动删除
  • setItem
  • getItem
  • clearItem
  • 存储时转化成字符串,获取时转化成对象
  • 仅在客户端中保存,不参与服务器通信

sessionstorage

  • 使用方法与local相同
  • 存储大小均为5mb
  • 仅在当前会话中有效,在关闭页面后即清空