跨域请求 CORS
什么是跨域请求?
跨域就是指在不同域名之间的相互访问。跨域指的就是浏览器不能执行其他网站的脚本,是由浏览器的同源策略造成的。 简单来说,就是从一个域名的网页去请求另一个域名的网页的资源,即为跨域请求。
同源策略:
是一个规范,在没有同源策略的情况下, 如果A网站通过JavaScript脚本获取到B网站的脚本,那么A网站就可以伪装成B网站的用户进行操作。
同源策略指的是:域名、协议、端口 三者全部相同
为什么要防止跨域请求?
防止跨域请求的主要原因主要有以下几点,
- 服务器可能会受到额外的请求访问,比如第三方的恶意调用。
- 有人恶意伪装网站,将我们的网站放入 ifram 标签中,进行伪装。如果有人通过他们的网站进行登陆,支付等操作,而此时恰好我们又没有进行防跨域的操作。那么用户的信息将会泄露,会对我们造成不好的印象。
- 也为了防止恶意网站在自己网站有访问其他网站的权力,以免通过cookie免登,拿到数据。
如何跨域:
-
JSONP
这个方案相当于黑魔法,因为js的调用是不会经过同源策略,例如baidu.com 应用了CDN的jquery,所以我通过调用js脚本的方式,可以从服务器上获取json数据绕过同源策略。 -
Http响应头配置允许跨域
CORS:CORS(跨域资源共享)只用专有的HTTP头,服务器告诉浏览器,特定URL的ajax请求可以直接使用,不会激活同源策略。 -
nginx层进行配置,运用反向代理
-
程序代码中处理
@Configuration public class Cors extends WebMvcConfigurerAdapter { @Override public void addCorsMappings(CorsRegistry registry) { registry.addMapping("/**") .allowedOrigins("*") .allowedMethods("GET", "POST", "PUT", "OPTIONS", "DELETE", "PATCH") .allowCredentials(true).maxAge(3600); } }
ps:如果接口报错,则跨域配置不生效
ps:利用document.domain实现跨域:利用document.domain实现跨域的时候,会有一些条件限制。就是这两个域名必须数据同一基础域名(主域名),而且锁用的协议,端口都要一致,否则无法利用document.domain进行跨域。
比如在:aaa.com的一个网页(a.html)里面 利用iframe引入了一个bbb.com里的一个网页(b.html)。
这时在a.html里面可以看到b.html里的内容,但是却不能利用javascript来操作它。因为这两个页面属于不同的域,在操作之前,js会检测两个页面的域是否相等,如果相等,就允许其操作,如果不相等,就会拒绝操作。
这里不可能把a.html与b.html利用JS改成同一个域的。因为它们的基础域名不相等。(强制用JS将它们改成相等的域的话会报跟上面一样的"参数无效错误。")
如何防止跨域:
- 检查referer字段:在我们对网站进行网页跳转的时候,浏览器的请求头中会默认自带一个referer字段,通过判断该字段的值是否与我们的网站网址是否相同,就可以判断该请求是否来自于本网站。
- Controller上使用@CrossOrigin注解
- 及时清理cookie:在用户关闭网页标签时,要及时清理认证的cookie支持TAB模式(新标签打开网页)的浏览器尤为重要。
- 通过图形验证码:该种方法通常使用在网站的注册或登陆时,以免第三方通过跨域来对我们进行恶意注册。
- 添加校验token:在用户首次访问我们网站,将自定义信息放到指定的位置。在下次请求我们网站的时候,通过对指定的参数进行判断,就可以过滤一部分的请求。
(1)放到自定义请求头中:
(2)放到请求表单中: