🗒️同源跨域解决方案

type
status
slug
date
summary
tags
category
password
icon
 

简介

跨域是同源策略的限制
  1. 同源策略是一种约定,由Netscape公司1995年引入浏览器,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到XSS、CSFR等攻击。所谓同源是指"协议+域名+端口"三者相同,即便两个不同的域名指向同一个ip地址,也非同源。
  1. 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...
文章列表
王小扬博客
产品
Think
Git
软件开发
计算机网络
CI
DB
设计
缓存
Docker
Node
操作系统
Java
大前端
Nestjs
其他
PHP