什么是CORS

作者: 柏龙 | 来源:发表于2017-04-25 22:35 被阅读141次

CORS 全称是跨域资源共享(Cross-Origin Resource Sharing),是一种 AJAX 跨域请求资源的方式,支持现代浏览器,IE支持10以上。
CORS与JSONP的使用目的相同,但是比JSONP更强大。JSONP只支持GET请求,CORS支持所有类型的HTTP请求。JSONP的优势在于支持老式浏览器,以及可以向不支持CORS的网站请求数据。

CORS可以分成两种请求

浏览器将CORS请求分成两类:简单请求(simple request)和非简单请求(not-so-simple request)

只要同时满足以下两大条件,就属于简单请求

  • 请求方法是以下三种方法之一:
HEAD
GET
POST
  • HTTP的头信息不超出以下几种字段:
Accept
Accept-Language
Content-Language
Last-Event-ID
Content-Type:只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain

不同时满足上面两个条件,就属于非简单请求。

简单请求时 Request Headers 会添加一个 Origin 字段

Accept:*/*
Accept-Encoding:gzip, deflate, sdch
Accept-Language:zh-CN,zh;q=0.8,en;q=0.6,zh-TW;q=0.4,pt;q=0.2,fr;q=0.2
Cache-Control:no-cache
Connection:keep-alive
Host:b.code.com:8080
Origin:http://a.code.com:8080
Pragma:no-cache
Referer:http://a.code.com:8080/
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/57.0.2987.133 Safari/537.36

以上会出现本次请求来自哪个源(协议 + 域名 + 端口),
Origin 指定的源,不在许可范围内,服务器会返回一个正常的HTTP回应。

Connection:keep-alive
Content-Length:430
Content-Type:application/json; charset=utf-8
Date:Tue, 25 Apr 2017 14:08:44 GMT
ETag:W/"1ae-VP1n2Jqobg5OeVKZa52pn4FP1/k"
X-Powered-By:Express

Response Headers 没有包含 Access-Control-Allow-Origin 字段,
服务器抛出XMLHttpRequest不能加载的错误

XMLHttpRequest cannot load http://b.code.com:8080/getNews. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://a.code.com:8080' is therefore not allowed access.

如果 Origin 指定的域名在许可范围内,服务器返回的响应,会多出1个头信息字段。

Access-Control-Allow-Origin:http://a.code.com:8080

Access-Control-Allow-Origin的值要么是请求时Origin字段的值,要么是一个*,表示接受任意域名的请求。

// 限制当前请求http://a.code.com:8080可以获取数据
header("Access-Control-Allow-Origin", "http://a.code.com:8080"); 
// 接受任何请求
// header("Access-Control-Allow-Origin", "*");

以上就可以跨域资源共享,实现跨域。
查看实例代码
https://boloog.github.io/demos/Cross-domain/mp4/cors.mp4

相关文章

  • Express: 启用 cors

    我的自建博客上的文章原地址:Express: 启用 cors 什么是 CORS CORS ([Cross-Orig...

  • 什么是CORS?

    CORS 什么是CORS? CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resou...

  • 什么是CORS

    CORS 全称是跨域资源共享(Cross-Origin Resource Sharing),是一种 AJAX 跨域...

  • 什么是CORS?

    CORS是目前主流的跨域解决机制, 它是一个W3C标准, 全称是"跨域资源共享(Cross-origin reso...

  • 初探CORS

    这篇博客的目的是探究一下CORS前后端的实现 CORS是什么? CORS全拼是Cross-Origin Resou...

  • HTTP访问控制(CORS)

    什么是CORS? CORS(Cross-Origin Resource Sharing ) 全称“跨域资源共享”,...

  • 使用Node.js处理CORS

    介绍 在本文中,我们将研究什么是CORS,如何使用Express配置CORS,以及如何根据需要定制CORS中间件。...

  • CORS Via Web API 2

    前言 什么是CORS,看起来怎么有点像CQRS?CORS是Cross-Origin Resource Sharin...

  • 用CORS 解决vue.js django跨域调用

    1 什么是 CORS? Cross-Origin Resource Sharing(CORS)跨域资源共享是一份浏...

  • Koa中间件使用之koa-cors

    了解CORS 什么是CORS 跨域资源共享(Cross-Origin Resource Sharing)是一种机制...

网友评论

    本文标题:什么是CORS

    本文链接:https://www.haomeiwen.com/subject/unebzttx.html