跨域相关概念归档

未前后端分离的系统:

前端和后端打在同一个war包, 使用的是同一个域名和端口

已前后端分离的系统:

前端和后端分开打包,独立部署, 使用的是不同的端口和域名

谁来检测是否登录:

后端服务器

如何检测是否登录:

通过sessionid获取对应的session, 再判断sesison变量中是否存在登录信息

浏览器同源策略:

  • 协议相同。不能一个是 http 协议,一个是 https
  • 域名相同
  • 端口相同

非同源页面有以下限制:

  • LocalStore 和 IndexDB 无法读取。这两个显然是不能读取的,但是 cookie 有点不一样
  • DOM 无法获取,比如如法在页面 A 中通过 iframe 获取异源页面 B 的 DOM
  • AJAX 请求无法读取(可以发送请求,但是无法读取到请求结果。比如在页面 A 中请求异源接口 B,请求会正常发出处理,但是在页面 A 中无法获取请求结果,除非响应头 Access-Control-Allow-Headers 中允许了页面 A 的源,这样就能读取到结果)

cookie 同源策略:

image.png

cookie 的同源策略是通过Domain,path, 两个部分来共同确认一个 cookie 在哪些页面上可用

Domain确定这个 cookie 所属的域名,不能带端口或协议。因此 cookie 便可在不同端口/不同协议下共享,只要域名相同。有一个例外是父子域名间也能共享 cookie,只需将 Domain 设置为.父域名

path就简单多了,通过 Domain 确定哪些域名可以共享 cookie,然后在通过path来确定 cookie 在哪些路径下可用。使用/表示所有路径都可共享

具体如下:
Domain : example, path : /a 可获取 cookie: http://example:8081/a, https://example:8081/a
Domain : example, path : / 可获取 cookie: http://example:8081/a, https://example:8081/a, http://example:12/abcd
Domain : .example, path : /a 可获取 cookie: http://example:8081/a, https://localhost:8081/a, http://test.example:889/a

注意:
在跨域请求中,即时目标地址有 cookie 且发起请求的页面也能读取到该 cookie,浏览器也不会将 cookie 自动设置到该跨域请求中。比如在 http://localhost:8082/a 页面中请求 http://localhost:8081/abc, 这两个地址下拥有共享cookie, http请求也不会携带cookie

cookie的原理及作用以及如何设置、读取和删除cookie

cookie特点:

  • cookie的数据存储在硬盘上, 不同的浏览器存放的cookie位置不一样,也是不能通用的。
  • Cookie 是由 Web 服务器保存在用户浏览器(客户端)上的小文本文件,它可以包含有关用户的信息。无论何时用户链接到服务器,Web 站点都可以访问 Cookie 信息
  • cookie的存储是以域名的形式进行区分的
  • cookie的数据可以设置名字
  • 一个域名下存放的cookie的个数是有限制的(不同浏览器不一样)
  • ajax请求中的cookie信息是浏览器读取cookie文件,自动设置上去的,与js代码无直接关联
  • js进行cookie的读/写/删除, 是根据cookie的类型:持久化cookie是对cookie文件内容进行读/写/删除, 会话session是对内存中的cookie进行读/写/删除
  • 后端服务器设置的session, 实际上也是由浏览器写入到了客户端电脑的cookie文件中或内存中

session与cookie关系

session是一种保存上下文信息的机制,它是针对每一个用户的,变量的值保存在服务器端,通过SessionID来区分不同的客户端,session是以Cookie或URL重写为基础。默认使用Cookie来实现,系统会创造一个名为JSESSIONID的输出Cookie,或称为"Session Cookie",以区别Persistent Cookies(通常所说的Cookie).Session Cookie是存储在浏览器中,并不是写在硬盘上的,但是把浏览器的Cookie禁止后,使用response对象的encodeURL或encodeRedirectURL方法编码URL,WEB服务器会采URL重写的方式传递Sessionid,用户就可以在地址栏看到jsessionid=A09JHGHKHU68624309UTY84932之类的字符串。

通常Session Cookie是不能跨窗口使用,当用户新开了一个浏览器进入相同的页面时,系统会赋予用户一个新的SessionID,这样信息共享的目的就达不到,此时可以把SessionID保存在Persistent Cookie中,然后再新的窗口中读出来,就可以得到上一个窗口的SessionID了,这样通过Session CookiePersistent Cookie的结合,实现了跨窗口的会话跟踪。

Cookie 是一小段文本信息,伴随着用户请求和页面在 Web 服务器和浏览器之间传递。用户每次访问站点时,Web 应用程序都可以读取 Cookie 包含的信息。 Cookie 的基本工作原理如果用户再次访问站点上的页面,当该用户输入 URLwww.*****.com时,浏览器就会在本地硬盘上查找与该 URL 相关联的 Cookie。如果该 Cookie 存在,浏览器就将它与页面请求一起发送到您的站点。

Cookie 有哪些用途?

最根本的用途是:Cookie 能够帮助 Web 站点保存有关访问者的信息。更概括地说,Cookie 是一种保持Web 应用程序连续性(即执行“状态管理”)的方法.使 Web 站点记住您.

cookie失效

cookie失效分为2种
1:设置过期时间失效(只要设置了过期时间cookie就会存储在硬盘里面)
2:当会话结束时失效,即关闭浏览器窗口(如果没有设置Expires,cookie就会存储在内存里面)

什么是会话Session?

当用户访问您的站点时,服务器会为该用户创建唯一的会话,会话将一直延续到用户访问结束。

资源:

文中提到的资源指: 界面, 后端服务

ajax跨域问题解决方式:

方式一: 前端使用代理

那么实际的ajax请求, 就变成了前端代理服务器与后端服务器的交互, 服务器与服务器之间的直接通信是不存在跨域问题的.

那么实际的请求就变成了, 前端发送一个ajax请求, 实际是先发送到了代理服务器, 代理服务器再将请求转发到后端服务器, 后端服务器执行请求, 并将响应写会前端代理服务器, 前端代理服务器再将结果返回给ajax客户端

方式二: 前端不使用代理 (以前端使用的ajax为axios为例)

axios要设置 withCredentials = true 这个表示: 跨域的情况接收服务器response的set-cookies[前提是后端允许这个第三方域的访问], 并且执行跨域请求也会携带对应域的 cookie

这种方式在每一个真实请求发出之前, 都会先执行一个OPTION请求, 该OPTION请求的作用是浏览器用来询问后端服务器, 是否支持当前域名发起的跨域请求

你可能感兴趣的:(跨域相关概念归档)