🗒️同源跨域解决方案
type
status
slug
date
summary
tags
category
password
icon
简介JSONPCROS前端配置后端配置简单请求非简单请求nginx重定向问题Redirect is not allowed for a preflight request报错iframe跨域通信(postMessage)前端代理参考其他PreFlight请求是什么
简介
跨域是同源策略的限制
- 同源策略是一种约定,由Netscape公司1995年引入浏览器,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到XSS、CSFR等攻击。所谓同源是指"协议+域名+端口"三者相同,即便两个不同的域名指向同一个ip地址,也非同源。
- https 中访问 http 浏览器安全限制,反过来 http 访问 https,不跨域应该是允许的
JSONP
1. JSONP script 标签发送处理;只能发 get
CROS
前端配置
后端配置
简单请求
非简单请求
比如请求方法是PUT或DELETE,或者Content-Type字段的类型是application/json。非简单请求的CORS请求,会在正式通信之前,增加一次HTTP查询请求,称为"预检"请求(preflight)。
预检"请求用的请求方法是OPTIONS
nginx
nginx 前后端同源,通过路径设置后端反向代理
重定向问题Redirect is not allowed for a preflight request报错
默认转了 https,如果是 http 页面发 http,http 会转 https 就会报这个错
http页面会将发送的http请求,重定向为https请求
排除这个问题后就看报什么错了,请求头属性不支持就加请求头,域名不支持就加域名
还有一种情况就是强制HTTPS (HSTS) 导致 CORS preflight 请求失败的问题
iframe跨域通信(postMessage)
前端代理
参考
其他
PreFlight请求是什么
我们都知道浏览器常用的请求有
POST
GET
PUT
DELETE
等,不知道大家有没有关注过还有个请求类型叫OPTIONS
。一般来说preflight
预检请求,指的就是OPTIONS
请求。它会在浏览器认为即将要执行的请求可能会对服务器造成不可预知的影响时
,由浏览器自动发出。通过预检请求,浏览器能够知道当前的服务器是否允许执行即将要进行的请求,只有获得了允许,浏览器才会真正执行接下来的请求。 通常preflight
请求不需要用户自己去管理和干预,它的发出的响应都是由浏览器和服务器自动管理的。上一篇
是时候放弃全栈开发了
下一篇
whistle和Clash共存双层代理
Loading...