跨域问题---本质在于HTTP协议的理解不够深

https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS
https://www.sohu.com/a/241967861_661296
https://www.imooc.com/article/21976
首先从定义入手:
跨域资源共享(CORS) 是一种机制,它使用额外的 HTTP 头来告诉浏览器 让运行在一个 origin (domain) 上的Web应用被准许访问来自不同源服务器上的指定的资源。当一个资源从与该资源本身所在的服务器不同的域、协议或端口请求一个资源时,资源会发起一个跨域 HTTP 请求。
解读:浏览器通过http头来判断是否可以访问不同源服务器的资源,在后面我们知道为了实现判断的过程,存在一个预检请求,通过预检请求的头来判断是否允许跨域资源共享,如果允许,继而发出非相应的get,post以及其它请求。
值得一提的是,其实跨域请求一直都有发出,只可能是没有返回。
一次完整的跨域请求设涉及到服务端和客户端。
跨域资源共享标准新增了一组 HTTP 首部字段,允许服务器声明哪些源站通过浏览器有权限访问哪些资源。另外,规范要求,对那些可能对服务器数据产生副作用的 HTTP 请求方法(特别是 GET 以外的 HTTP 请求,或者搭配某些 MIME 类型的 POST 请求),浏览器必须首先使用 OPTIONS 方法发起一个预检请求(preflight request),从而获知服务端是否允许该跨域请求。服务器确认允许之后,才发起实际的 HTTP 请求。在预检请求的返回中,服务器端也可以通知客户端,是否需要携带身份凭证(包括 Cookies 和 HTTP 认证相关数据)。
CORS请求失败会产生错误,但是为了安全,在JavaScript代码层面是无法获知到底具体是哪里出了问题。你只能查看浏览器的控制台以得知具体是哪里出现了错误。

解读:资源是否允许跨域访问取决于服务端是否在新增的一组头中填上适当的信息。规范并要求了对某些会产生副作用的请求发起预检请求,这一规范由浏览器实现
关于在什么情况下会发出预检请求,简单但内容较多。对于开发人员来说,知道如何控制资源的跨域访问即可。
总结:解决跨域问题的根本还是从服务端着手
一个不一样的问题:
has been blocked by CORS policy: The ‘Access-Control-Allow-Origin’ header contains multiple values ‘http://localhost:63342, http://localhost:63342’, but only one is allowed.
这个的意思就是:Access-Control-Allow-Origin应该只有一个值,发现这个问题是在spring cloud框架中如果网关和微服务都出跨域就会追加,一旦追加就会报错

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值