跨域-CORS

kevin 发布于2019-08-20 17:37 / 2587人阅读

摘要：一概念跨源资源共享访问控制，后面会看到以前缀的头部字段。机制让服务端控制是否准许跨域请求当然了也要承担确保安全的职责。服务端怎么浏览器这样吧，如果是跨域请求，我先咨询下你，如果你觉得请求安全，我再把真实请求发给你。

一、概念：

跨源资源共享：（Cross-Origin Resource Sharing）
访问控制：Access Control，后面会看到以Access-Control前缀的头部字段。

二、引入背景：

JS中的xhr请求（XMLHttpRequest）受同源策略限制。但是这也导致有些合理的请求也被限制了。W3C提出了新的标准CORS来解决这个问题。CORS机制让服务端控制是否准许跨域请求（当然了也要承担确保安全的职责）。教程参考MDN（即MDN的参考），下面做些总结性的笔记。

三、CORS原理 3.1 浏览器和服务端的谈判

服务端：hi，我说你管的也太多了！我认为request A是安全的，你怎么不发给我？
浏览器：我怎么知道request A是安全。为了安全起见，我不能发给你。
服务端：瞎子都能看出来reques是安全的。你个SB。
浏览器：你才SB
服务端：你SB
......
浏览器：咱天天这样吵也不是事啊。咱们各退一步。
服务端：怎么？
浏览器：这样吧，如果是跨域请求，我先咨询下你，如果你觉得请求安全，我再把真实请求发给你。（Origin, Access-Control-Allow-Origin）
服务器：恩，好吧。不过你每次都先咨询我，对性能会造成影响啊，再说了有些请求不存在安全问题。
浏览器：也是啊。这样吧，对于那些安全的请求，我直接发给你。简单请求的定义你看看
服务器：这个定义确实OK，但也太苛刻了，实际应用中很少遇到啊，这样对性能的提升没有实际解决。
浏览器：但是确保安全是我底线。这个没得让步。
服务器：要不这样，你把预检的结果缓存一段时间，在缓存时间内不用再发送预检请求。
浏览器：好想法，就这样干。不过你得告诉我缓存多久。
服务器：可以啊。（Access-Control-Max-Age）

3.2 CORS流程图

3.3CORS-服务端

要实现CORS机制离不开服务端的配合。为了更好的实现支持CORS服务接口，需要注意几点

request可能会请求服务两次(预检，真实请求),在处理预检过程中不要做真实请求的逻辑处理。

参考：

MDN：

https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

W3C：

https://www.w3.org/TR/cors/

GPU云服务器云服务器 CORS 服务器 cors cors 登陆服务器 flask-cors

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/83733.html

第二十五章：SpringBoot添加支持CORS跨域访问

摘要：本章目标基于项目搭建可以站外请求访问的跨域资源服务器。允许所有的请求域名访问我们的跨域资源，可以固定单条或者多条内容，如，只有百度可以访问我们的跨域资源。 CORS（Cross-Origin Resource Sharing）跨域资源共享，是一个W3C标准，它允许浏览器向跨域服务器发送Ajax请求，打破了Ajax只能访问本站内的资源限制，CORS在很多地方都有被使用，微信支付的JS支付...

simpleapples 2019-08-15 12:01 评论0 收藏0
「新轮子」PHP CORS (Cross-origin resource sharing)，解决 P

摘要：而我的新轮子也并不是专门解决它的问题的，而是顺便解决而已。概述这个包，支持在所有的项目中使用。一旦出现成员，代表允许全部。列出允许跨域请求的方法列表，默认是代表所有方法。信息地址嗯，新轮子，求一波。 showImg(https://segmentfault.com/img/bV5VxN?w=844&h=656); 是的，可能了解 Laravel 的都知道，在 Laravel 中简单的设...

lbool 2019-06-28 18:34 评论0 收藏0
【日常填坑】之ajax请求laravel的api接口

摘要：合适和够用是最完美的追求。比如从页面去请求的资源。它允许浏览器向跨源服务器，发出请求，从而克服了只能同源使用的限制。定义在中的路由都是无状态的，并且会应用中间件组。关于作者程序开发人员，不拘泥于语言与技术，目前主要从事PHP和前端开发，使用Laravel和VueJs，App端使用Apicloud混合式开发。合适和够用是最完美的追求。个人网站：http://www.linganm...

Arno 2019-06-27 15:31 评论0 收藏0
【日常填坑】之ajax请求laravel的api接口

摘要：合适和够用是最完美的追求。比如从页面去请求的资源。它允许浏览器向跨源服务器，发出请求，从而克服了只能同源使用的限制。定义在中的路由都是无状态的，并且会应用中间件组。关于作者程序开发人员，不拘泥于语言与技术，目前主要从事PHP和前端开发，使用Laravel和VueJs，App端使用Apicloud混合式开发。合适和够用是最完美的追求。个人网站：http://www.linganm...

neu 2019-08-20 14:28 评论0 收藏0
【日常填坑】之ajax请求laravel的api接口

摘要：合适和够用是最完美的追求。比如从页面去请求的资源。它允许浏览器向跨源服务器，发出请求，从而克服了只能同源使用的限制。定义在中的路由都是无状态的，并且会应用中间件组。关于作者程序开发人员，不拘泥于语言与技术，目前主要从事PHP和前端开发，使用Laravel和VueJs，App端使用Apicloud混合式开发。合适和够用是最完美的追求。个人网站：http://www.linganm...

fuyi501 2019-08-01 16:20 评论0 收藏0