当前位置:首页 > 技术分析 > 正文内容

轻松理解什么是同源策略

ruisui883周前 (04-07)技术分析7

同源策略是浏览器的一种安全策略,用于隔离不同网站之间的资源,防止不同网站之间的资源滥用,本文将从三个部分讲解同源策略:

  • 第一点 what:什么是同源策略?
  • 第二点 why:为什么需要同源策略?
  • 第三点 how:如何解决经典的跨域问题?

0x01 什么是同源策略?

早期的互联网应用,大多只有纯文本,随着互联网的发展,网页资源越来越丰富,比如其他文档、媒体资源、cookie、javascript 命名空间等,为了能够在浏览器范围内,能够安全的进行实体交互,Netscape 工程师设计开发了 SOP(同源策略)的规则用于管理这些资源之间的关系。

说起来,同源策略就是浏览器为了不同网站之间的资源安全的访问而制定的一系列策略,关于同源策略,需要解决两个问题:

1、什么样的情况下属于同源?

首先我们要理解一个网页的不同组成部分:协议、主机、端口,比如:

https://www.xazlsec.com:443/

其中 https 为协议、www.xazlsec.com 为主机、443 为端口,认识这个之后,不同的浏览器所设置的同源规则有所差异,比如谷歌浏览器和火狐浏览器认为只有协议+主机+端口都一致的情况下才是同源,而 IE 浏览器不管端口只要协议+主机一致,则认为是同源。

下面以
https://www.xazlsec.com/dir/test.html 为基准,看看下面的 url 是否同源(以谷歌浏览器为例):

2、不同源之间的资源访问规则是什么样的?

不同源之间的资源默认是不允许相互访问的,除了以下几个特例:

  • 页面链接,比如 a 标签
  • 重定向
  • 表单提交
  • 跨域资源的引入,比如 script、img、link、iframe 等标签

同源策略定义的规则如下:

  • 每个网站都有自己的资源,比如 cookie、dom 和 Javascript 命名空间
  • 每个页面的来源都来自于 URL( 通常是协议、域名和端口)
  • 脚本在它所加载源的上下文中执行,从哪里加载资源并不重要,只有最终执行的地方才重要
  • 许多资源都是被动资源,无法访问它们所加载上下文中的对象和资源

基于这些规则,假如站点 A 是起源站:

  • 可以从源 B 加载的脚本,但是不能脚本执行是在 A 的上下文中
  • 可以从源 B 加载 CSS 文件,但是无法获取源 B 的 css 原始文件
  • 可以通过 iframe 从源 B 加载页面,但是无法通过 iframe 加载源 B 页面的 DOM 对象
  • 可以从源 B 加载图像,但是无法获取该图像的像素
  • 可以播放源 B 的视频,但是无法捕获该视频的截图

也就是有了这些规则,丰富的 web 内容才可以受到安全合理的保护,但是在实际的应用过程中,或多或少会存在跨域资源访问的情况,为了解决这类问题,出现了多种跨域资源访问的解决方案,比如 XmlHTTPRequestJSONPXDomainRequest 和 CORS。

0x02 为什么需要同源策略

要说为什么,那么假如没有同源策略会怎么样?比如:

  • cookie 是每个网站都特有的内容,用于区分不同用户的身份,假如没有同源策略,在访问任意网站时,都会携带所有浏览器保存的 cookie,一方面其他网站的身份信息会存在泄漏的风险,另一方面 cookie 值的命名会存在重复,导致身份信息不可用
  • iframe 可以加载任意网站的网页内容,假如没有同源策略,可以通过 iframe 获取任意网站的内容,如果访问的内容中包含用户的敏感信息,那么就会存在信息泄漏的风险,以这种方式伪造网站,足以以假乱真

0x03 如何解决经典的跨域问题?

前文中提到过,为了解决跨域请求资源的问题,需要使用 XmlHTTPRequestJSONPXDomainRequest 和 CORS 进行扩展。

XmlHTTPRequest

XmlHTTPRequest 是一种 HTTP 通信方法,支持资源之间的异步通信,避免每次更新内容都要刷新网页。

XmlHTTPRequest 可以向不同的源发送请求,但是无法读取响应的内容,除非同源。

JSONP

JSONP 是一种 hack 技术,并不是官方解决跨域的手段,JSONP 只能进行 GET 请求,主要利用 <script> 标签来发起请求,来达到突破浏览器同源策略的目的。

XDomainRequest

XDomainRequest 是微软在 IE8 和 IE9 中的实现,实现方式与 CORS 几乎相同。

CORS

CORS 是一套跨域资源共享机制,基于 HTTP 头实现,允许浏览器向跨源服务器,发出 XMLHttpRequest 请求,从而克服了 AJAX 只能同源使用的限制。

0x04 总结

本文算是一个科普文,了解浏览器的同源策略是怎么一回事,这个基础对于前端问题的学习至关重要,比如 xss 漏洞的利用、CSRF 漏洞的利用等。

来源:信安之路

扫描二维码推送至手机访问。

版权声明:本文由ruisui88发布,如需转载请注明出处。

本文链接:http://www.ruisui88.com/post/3309.html

标签: 同源策略
分享给朋友:

“轻松理解什么是同源策略” 的相关文章

「干货」通俗易懂的Deno 入门教程

作者: semlinker转发链接:https://mp.weixin.qq.com/s/2eqRTsf_z7Bcs6dziXe73Q一、Deno 简介Deno 是一个 JavaScript/TypeScript 的运行时,默认使用安全环境执行代码,有着卓越的开发体验。Deno 含有以下功能亮点:默...

Git 分支管理策略与工作流程

(预警:因为详细,所以行文有些长,新手边看边操作效果出乎你的预料)团队开发中,遵循一个合理、清晰的Git使用流程,是非常重要的。否则,每个人都提交一堆杂乱无章的commit,项目很快就会变得难以协调和维护。看完这篇文章后,涉及GIT的工作中就会减少因为规范问题导致工作出错,当然如果你现在暂时还未有合...

用IDEA开发如何用Git快速拉取指定分支代码?

1,准备空的文件夹,git init2,关联远程仓库,git remote add origin gitlab地址3,拉取远程分支代码,git pull origin 远程分支名再用IDEA打开项目即可...

Vue实战篇|使用路由管理用户权限(动态路由)

权限控制是后台管理系统比较常见的需求,如果我们需要对某些页面的添加权限控制的话,那我们可以在路由管理中的权限做一些校验,没有通过权限校验的给出相应的提示或者直接跳转到报错页面。跟着我一起来学vue实战篇路由管理权限吧!权限校验函数getCurrentAuthority()函数用于获取当前用户权限,一...

三勾点餐系统java+springboot+vue3,开源系统小程序点餐系统

项目简述前台实现:用户浏览菜单、菜品分类筛选、查看菜品详情、菜品多属性、菜品加料、添加购物车、购物车结算、个人订单查询、门店自提、外卖配送、菜品打包等。后台实现:菜品管理、订单管理、会员管理、系统管理、权限管理等。 项目介绍三勾点餐系统基于java+springboot+element-plus+u...

一文看懂企业微信开发简易教程

为让开发者快速理解开发流程,本篇章展示如何一步步设计一个能与企业后台互动的自建应用。添加自建应用登录企业微信管理端 -> 应用与小程序 -> 应用 -> 自建,点击“创建应用”,设置应用logo、应用名称等信息,创建应用。创建完成后,在管理端的应用列表里进入该应用,可以看到agen...