springboot跨域过滤器fetch react Response to preflight request doesn‘t pass access control check问题
前言
浏览器出于安全考虑,限制了JS发起跨站请求,使用XHR对象发起请求必须遵循同源策略(SOP:Same Origin Policy),跨站请求会被浏览器阻止,这对开发者来说是很痛苦的一件事,尤其是要开发前后端分离的应用时。
在现代化的Web开发中,不同网络环境下的资源数据共享越来越普遍,同源策略可以说是在一定程度上限制了Web API的发展。
简单的说,CORS就是为了请求能够安全跨域而生的。至于CORS的安全性研究,本文不做探讨。
CORS浅述
名词解释
跨域资源共享(Cross-Origin Resource Sharing)
概念
是一种跨域机制、规范、标准,怎么叫都一样,但是这套标准是针对服务端的,而浏览器端只要支持HTML5即可。
作用
可以让服务端决定哪些请求源可以进来拿数据,所以服务端起主导作用(所以出了事找后台程序猿,无关前端^ ^)
常用场景
前后端完全分离的应用
服务端未允许跨域
如何解决
package pers.yiji.YiJiClientServer.util; import org.springframework.boot.web.servlet.FilterRegistrationBean; import org.springframework.context.annotation.Bean; import org.springframework.context.annotation.Configuration; import org.springframework.web.cors.CorsConfiguration; import org.springframework.web.cors.UrlBasedCorsConfigurationSource; import org.springframework.web.filter.CorsFilter; @Configuration public class CorsConfig { /** * cors support * @return */ @Bean public FilterRegistrationBean corsFilter() { // 注册CORS过滤器 UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource(); CorsConfiguration config = new CorsConfiguration(); config.setAllowCredentials(true); // 是否支持安全证书 config.addAllowedOrigin("*"); // 允许任何域名使用 config.addAllowedHeader("*"); // 允许任何头 config.addAllowedMethod("*"); // 允许任何方法(post、get等) // 预检请求的有效期,单位为秒。 // config.setMaxAge(3600L); source.registerCorsConfiguration("/**", config); FilterRegistrationBean bean = new FilterRegistrationBean(new CorsFilter(source)); bean.setOrder(0); return bean; } }
具体每句话的意思基本上注释都有写。
主要就是为了注册一个过滤器,这里是基本上允许所有的请求,在特殊的场景可以使用域名控制等。
config.addAllowedOrigin("*"); // 允许任何域名使用(*可以换成特定的域名)
结果
总结
以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。
相关文章
SpringBoot学习系列之MyBatis Plus整合封装的实例详解
MyBatis-Plus是一款MyBatis的增强工具(简称MP),为简化开发、提高效率,这篇文章给大家介绍MyBatis Plus整合封装的实例详解,感兴趣的朋友跟随小编一起看看吧2020-08-08Spring的BeanUtils.copyProperties属性复制避坑指南
这篇文章主要介绍了Spring的BeanUtils.copyProperties属性复制避坑指南,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-08-08
最新评论