同源与跨域问题

发布时间 2023-04-18 18:03:28作者: 挖洞404

前端跨域安全 – FreeBuf网络安全行业门户

1、同源

协议相同、主机名相同、端口相同的两个域名称为同源。而在实际中,一般比较的是请求中对应的域名,和发出请求的文档代表的域名。后者一般是地址栏url,但也可能是iframe框架。

跨域,主要是指域名不同。

2、最简

对于简单的站点来说,使用一组协议+主机名+端口即可。

在站点内,包括一般的静态资源请求(html、css、js、img等)和表单请求,以及可能的动态页面或接口。

3、状态与cookie

为了进一步的服务,需要保存状态的功能,尤其是登录状态。而http提供了cookie字段实现这一功能。

cookie在浏览器端区分主机名称作为domain存储,比如127.0.0.1和localhost是不同的,www.abc.com和bb.abc.com也是不同的。但是不区分协议和端口号。

4、进阶与session

session本质上也是cookie,只是将数据存储到服务端,传输的是id。同样遵循cookie的数据格式,以及在浏览器的存储。

session使得攻击者无法通过xss获取保存的信息,只能别动使用。

5、跨域和token

多域名属于同一组织,跨域管理登录状态,以使一键登录。

服务端可以将cookie的domain设置为较大范围的域名,以使其本身和子域名能够使用该cookie。这在一定程度上解决了同主域名下的跨域问题。

需要注意,这是解决cookie跨域,而session由于数据是存放在服务端,所以除了cookie的跨域,还需要服务端进行session的并联沟通,实际更可能的是交给同一的主机保管session或者数据库。

更关键的是,不同主域名的沟通基于cookie就不现实。token出现:在url的参数中、请求中添加字段、在体部中添加数据,服务端联系公共的数据库进行检查状态。

6、不同组织的跨域

可以分为两类,携带登录凭证,和非携带登录凭证。还可以分为ajax和html元素。

假设网站A和网站B是跨域,各自的登录凭证不同。一般默认是cookie,session也认为是cookie的一种。

(1)html元素发出跨域请求,浏览器默认允许发出和加载,且携带cookie凭证。

(2)ajax

  • 如果是同源,默认携带cookie凭证
  • 如果不同源,需要配置
    • 配置为*,允许所有对此进行请求,但是无法携带cookie
    • 想要发送身份凭证跨源请求中必须打开withCredentials属性,浏览器会携带cookie,此时服务端响应需要配置为true,且指定白名单

7、跨域的具体形式

前端跨域安全 – FreeBuf网络安全行业门户

(1)jsonp

jsonp可以携带cookie,但只能携带所属域名的cookie

(2)window

(3)postMessage

(4)CORS