Http的CORS

曾经终败给现在 2022-02-21 00:08 160阅读 0赞

### 文章目录 ###

*  浏览器的同源策略
 *  CORS
 *   *  例子
     *  预检请求

# 浏览器的同源策略 #

**所谓同源策略**，就是指浏览器会限制从一个源加载的网页和脚本与其他源的资源交互。**这是一种用于隔离潜在恶意软件的机制**。

可能有人会奇怪，明明网页是自己写的，自己怎么会请求含有恶意程序的URL呢？**话虽如此，** 可是我们在开发中经常会引入第三方的库，当我们通过`script`标签将它们引入的时候是没有限制的。**而它们之中就可能含有对恶意URL的请求。**

所谓**同源**，就是指两个URL的**协议、主机、端口**要一致。这就能看出同源策略的思路–“信任自家人”。因为同源的两个URL一般都是来自同一个企业或者个人，自己人不会坑自己人。

例如对`http://store.company.com/dir/page.html`的同源检测：

![在这里插入图片描述][20190410092436289.png]

**注：上面说“限制”，既指浏览器限制脚本发起跨域请求，也指浏览器允许发起跨域请求，但是响应被浏览器拦截**

# CORS #

同源策略默认阻止跨域获取资源。但是CORS给了web服务器这样的权限，即服务器可以选择，允许跨域请求访问到它们的资源。

CORS，即**Corss-Orgin Resource Sharing，跨域资源共享**。这是一个由一系列HTTP首部字段组成的系统，这些首部字段决定了浏览器是否阻止脚本中代码发起的跨域请求。

## 例子 ##

假设当前页面的URL为`http://www.a.com`，现在我想对`http://www.b.com`发起请求。

那么请求头中会包含一个`Origin`字段，值即为`http://www.a.com`。

响应头中则会包含`Access-Control-Allow-Origin`字段，该字段表示服务器允许哪些源发起的访问。若该字段的值为`*`或`http://www.a.com`，则跨域访问成功，若都不是，则跨域请求被浏览器拦截。

## 预检请求 ##

对于一些“**也许会对服务器造成影响**”的请求（例如`PUT`、带有参数的`POST`、`DELETE`等），浏览器会首先使用`OPTIONS`发起一个预检请求，**以便提前获知服务器是否可以允许后续将要发出的正式请求。**

预检请求的首部中会包含两个字段`Access-Control-Request-Method`和`Access-Control-Request-Headers`。

例如，`Access-Control-Request-Method: POST`，`Access-Control-Request-Headers:Content-Type`  
就是**告知服务器我将使用POST方法发起请求，并且请求首部字段中会包含一个`Content-type`**。

而在服务器的响应中会包含`Access-Control-Allow-Methods`、`Access-Control-Allow-Headers`、`Access-Control-Max-Age`。

前两个字段分别表示**服务器允许请求的方法**和**服务器允许请求首部包含的字段**。

而第三个字段表示在字段值所指定的时间内不必再次预检。

[20190410092436289.png]: /images/20220221/db3216b0fe134dafb60bd134bbf88f44.png

发表评论取消回复

表情：

评论列表（有 0 条评论，160人围观）

还没有评论，来说两句吧...

相关阅读

相关 Elasticsearch配置文件中的 http:cors.x字段

elasticsearch配置文件中http.cors.x字段用途和用法 cors解释：Cross Origin Resource Sharing 跨域资源共享 htt

古城微笑少年丶/ 2023年10月05日 03:16/ 0 赞/ 26 阅读

相关编码技巧——HTTP接口安全之CORS

日常开发中，对于一些新项目的api工程，会有专门的安全工程师对齐进行安全漏洞扫描，扫描出来的漏洞会被要求限期修复；本篇讲解CORS漏洞的基本概念、原理、示例，以及修复漏洞的代码

àì夳堔傛蜴生んèń/ 2023年09月29日 10:30/ 0 赞/ 34 阅读

相关前后端分离的Http请求和Cors问题

前后端分离，前端和后端在不同的服务器上，必然跨域错误 Access to XMLHttpRequest at '[http://127.0.0.1:8888/api/

亦凉/ 2023年06月27日 03:16/ 0 赞/ 20 阅读

相关浏览器报CORS 请求不是 http

火狐浏览器设置步骤: 1.进入火狐配置页进行设置 ,地址栏输入"about:config" 2.点击”我了解此风险”后进入页面 3.搜索”security.file

墨蓝/ 2023年05月29日 05:11/ 0 赞/ 1 阅读

相关 HTTP之访问控制「CORS」

序言跨域资源共享「CORS」就是在不同的域名、协议、端口直接请求资源。本文主要讲述了什么是跨域，什么情况下会出现预检请求，我司的跨域安全访问什么是跨域同源

谁借莪１个温暖的怀抱￠/ 2022年10月01日 05:56/ 0 赞/ 109 阅读

相关 HTTP：CORS

CORS [CORS][] （Cross-Origin Resource Sharing，跨域资源共享）是一个系统，它由一系列传输的HTTP头组成，这些HTTP头决定浏览

左手的ㄟ右手/ 2022年09月04日 11:00/ 0 赞/ 155 阅读

相关 SpringBoot的CORS

引自[我的gitbook][gitbook]： CORS（跨域资源共享），这是由W3C提出的。浏览器有同源策略，源\[origin\]就是协议、域名和端口号,同时同源策

r囧r小猫/ 2022年05月20日 01:46/ 0 赞/ 183 阅读

相关 Http的CORS

文章目录浏览器的同源策略 CORS 例子预检请求浏览器的同源策略所谓同源策略，就是指浏览器会限制从一个源加载的网页和

曾经终败给现在/ 2022年02月21日 00:08/ 0 赞/ 161 阅读

相关跨域访问小结 HTTP-访问控制（CORS）

跨域资源共享([CORS][]) 是一种机制，它使用额外的 [HTTP][] 头来告诉浏览器让运行在一个 origin (domain) 上的Web应用被准许访问来自不同源

雨点打透心脏的1/2处/ 2021年11月23日 11:08/ 0 赞/ 382 阅读

相关 CORS

CORS 跨域请求CORS 代码示例跨域请求CORS CORS 全称为 Cross Origin Resource Sharing（跨域资源共享），

以你之姓@/ 2021年10月06日 03:06/ 0 赞/ 387 阅读