跨域指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对JavaScript施加的安全限制。在做前后端分离项目的时候就需要解决此问题。
创建过滤器解决跨域问题
（就是前后端在不同服务器上运行）注意：局部和全局只能选择一种！！！
本文只讲述了解决跨域问题的方法，不提供源码讲解。
开启跨域配置
如果使用了springsecurity则需要在securityconfig中添加 .cors()
全局开启：
SecurityConfig:(随便一个config都行，这里就先放在securityconfig里)
@Bean
public CorsFilter corsFilter() {
//创建CorsConfiguration对象后添加配置
CorsConfiguration config = new CorsConfiguration();
//设置放行哪些原始域，这里直接设置为所有
config.addAllowedOriginPattern("*");
//你可以单独设置放行哪些原始域 config.addAllowedOrigin("http://localhost:2222");
//放行哪些原始请求头部信息
config.addAllowedHeader("*");
//放行哪些请求方式，*代表所有
config.addAllowedMethod("*");
//是否允许发送Cookie，必须要开启，因为我们的JSESSIONID需要在Cookie中携带
config.setAllowCredentials(true);
//映射路径
UrlBasedCorsConfigurationSource corsConfigurationSource = new UrlBasedCorsConfigurationSource();
corsConfigurationSource.registerCorsConfiguration("/**", config);
//返回CorsFilter
return new CorsFilter(corsConfigurationSource);
}
局部开启：在controller类上加注解 @CrossOrigin（ 可以详细看注解里面的设置
@CrossOrigin
@RestController
@RequestMapping("/api/user")
public class AccountApiController {
}
如果是自己写的前端需要在发送每个请求的时候带cookie信息（自定义请求，开启get、post请求时带cookie）
function get(url,data, success){
$.ajax({
type: "get",
url: url,
data:data,
async: true,
dataType: 'json',
xhrFields: {
withCredentials: true //开启携带cookie信息，用于security识别用户是否登录
},
success: success
});
}
function post(url, data, success){
$.ajax({
type: "post",
url: url,
async: true,
data: data,
dataType: 'json',
xhrFields: {
withCredentials: true
},
success: success
});
}
//举例：
function initUserInfo() {
get('http://localhost:8080/api/user/info', {},function (data) { //这里要加{}，告诉data是空，否则会吧后面的当作data
if (data.code === 200) {
alert("登录成功,欢迎" + data.data.username + "进入图书管理系统！")
} else {
alert(data.reason)
window.location = "http://localhost:8080/login.html"
}
})
}
本文来自博客园，作者：不吃紫菜，遵循CC 4.0 BY-SA版权协议，
转载请附上原文出处链接：https://www.cnblogs.com/buchizicai/p/16517381.html及本声明;
本文版权归作者所有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。
Original: https://www.cnblogs.com/buchizicai/p/16517381.html
Author: 不吃紫菜
Title: 通过过滤器实现前后端分离的跨域问题
原创文章受到原创版权保护。转载请注明出处：https://www.johngo689.com/578702/
转载文章受原作者版权保护。转载请注明原作者出处！