CORS

作者: 尘满面鬓微霜 | 来源:发表于2017-03-25 00:09 被阅读0次

CORS是一个W3C标准,全称是“跨域资源共享”(Cross-origin resource sharing)。它允许浏览器向跨源服务器,发出XMLHttpRequest请求,从而克服了AJAX只能[同源]使用的限制。整个CORS通信过程,都是浏览器自动完成,不需要用户参与。实现CORS通信的关键是服务器。简单请求和非简单请求。

简单请求

对于简单请求,浏览器直接发出CORS请求。具体来说,就是在头信息之中,增加一个Origin字段。Origin字段用来说明,本次请求来自哪个源(协议 + 域名 + 端口)。服务器根据这个值,决定是否同意这次请求。如果Origin指定的源,不在许可范围内,服务器会返回一个正常的HTTP回应。浏览器发现,这个回应的头信息没有包含Access-Control-Allow-Origin字段(详见下文),就知道出错了,从而抛出一个错误,被XMLHttpRequest的onerror回调函数捕获。注意,这种错误无法通过状态码识别,因为HTTP回应的状态码有可能是200。

非简单请求

非简单请求是那种对服务器有特殊要求的请求,比如请求方法是PUT或DELETE,或者Content-Type字段的类型是application/json。非简单请求的CORS请求,会在正式通信之前,增加一次HTTP查询请求,称为“预检”请求(preflight)。“预检”被拒绝之后,同样触发XMLHttpRequest的onerror事件。一旦服务器通过了“预检”请求,以后每次浏览器正常的CORS请求,就都跟简单请求一样

var url = 'http://api.alice.com/cors';
var xhr = new XMLHttpRequest();
xhr.open('PUT', url, true);
xhr.setRequestHeader('X-Custom-Header', 'value');
xhr.send();

CORS与JSONP的使用目的相同,但是比JSONP更强大。JSONP只支持GET请求,CORS支持所有类型的HTTP请求。JSONP的优势在于支持老式浏览器,以及可以向不支持CORS的网站请求数据。

相关文章

  • 如何处理浏览器的跨域问题

    第一种方式 CORS 首先你需要阅读CORS,首先你需要阅读CORS,首先你需要阅读CORS,重要的事情说3遍 当...

  • Express: 启用 cors

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

  • express 解决跨域

    使用cors中间件解决跨域问题 npm install cors 安装中间件 const cors = requ...

  • 跨域

    1、Json jsonp 只能支持 get 请求; 2、cors cors 可以支持多种请求。cors 并不需要前...

  • 跨域【详解】

    本篇有四种方法跨域:CORS、JSONP、降域、window.postMessage() 1. CORS CORS...

  • egg

    一 、egg.js之解决跨域问题(egg-cors) 下载 egg-cors 包npm i egg-cors --...

  • express解决跨域问题

    有以下2种解决办法: 第一种,使用cors插件 先安装cors插件 npm install cors --save...

  • 初探CORS

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

  • Java Web前后端分离中CORS配置及OPTIONS请求优化

    Java Web前后端分离中CORS配置及OPTIONS请求优化 0x00 CORS 概述 跨域资源共享(CORS...

  • 使用Node.js处理CORS

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

网友评论

      本文标题:CORS

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