【精品】SpringBoot跨域请求 解决方案汇总
2024-04-29 22:01:00
代码下载地址：本博客示例代码
第一步：创建前端页面
项目结构图
页面代码
<!DOCTYPE html>
<html lang="zh-cn">
<head><title>添加部门</title><script src="js/jquery.min.js"></script><script type="text/javascript">$(function () {$.ajax({url: "http://localhost/ky/fun", //假设服务器端请求的urldata: {p: "helloworld"},dataType: "json",success: function (res) {res = JSON.stringify(res);console.log(res);$("#show").text(res);}});});</script>
</head>
<body>
<div id="show"></div>
</body>
</html>
第二步：创建SpringBoot项目
添加Maven依赖
<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-web</artifactId>
</dependency>
Controller代码
@RestController
public class DemoController {@RequestMapping("/fun")public String fun(String p){System.out.println("param "+p);return "{\"name\":\"zhangsan\"}";}
}
第三步：具体实现跨域的方法
方法一：重写WebMvcConfigurer（全局跨域）
@Configuration
public class CorsConfig implements WebMvcConfigurer {@Overridepublic void addCorsMappings(CorsRegistry registry) {//添加映射路径registry.addMapping("/**")//是否发送Cookie.allowCredentials(true)//设置放行哪些原始域.allowedOriginPatterns("*")//放行哪些请求方式.allowedMethods("GET", "HEAD", "POST", "PUT", "DELETE", "OPTIONS")//.allowedMethods("*") //或者放行全部//放行哪些原始请求头部信息.allowedHeaders("*")//暴露哪些原始请求头部信息.exposedHeaders("*").maxAge(3600);}
}
说明：
- addMapping：配置可以被跨域的路径，可以任意配置，可以具体到直接请求路径。
- allowedOrigins：允许所有的请求域名访问我们的跨域资源，可以固定单条或者多条内容，如：“http://www.baidu.com”，只有百度可以访问我们的跨域资源。
- allowCredentials： 响应头表示是否可以将对请求的响应暴露给页面。返回true则可以，其他值均不可以
- allowedMethods：允许输入参数的请求方法访问该跨域资源服务器，如：POST、GET、PUT、OPTIONS、DELETE等。
- allowedHeaders：允许所有的请求header访问，可以自定义设置任意请求头信息，如：“X-YAUTH-TOKEN”
- maxAge：配置客户端缓存预检请求的响应的时间（以秒为单位）。默认设置为1800秒（30分钟）。
下面代码也可以写成如下形式：
public class CorsConfig {@Beanpublic WebMvcConfigurer corsConfigurer() {return new WebMvcConfigurer() {// 重写父类提供的跨域请求处理的接口@Overridepublic void addCorsMappings(CorsRegistry registry) {// 添加映射路径registry.addMapping("/**")// 放行哪些原始域.allowedOriginPatterns("*")// 是否发送Cookie信息.allowCredentials(true)// 放行哪些原始域(请求方式).allowedMethods("GET", "HEAD", "POST", "PUT", "DELETE", "OPTIONS", "PATCH")// 放行哪些原始域(头部信息).allowedHeaders("*")// 暴露哪些头部信息（因为跨域访问默认不能获取全部头部信息）.exposedHeaders("Header1", "Header2")// 预请求的结果有效期，默认1800分钟,3600是一小时.maxAge(3600);}};}}
方法二：自定义Filter解析跨域（全局跨域）
import org.springframework.boot.SpringBootConfiguration;
import org.springframework.context.annotation.Bean;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;@SpringBootConfiguration
public class WebGlobalConfig {@Beanpublic CorsFilter corsFilter() {//创建CorsConfiguration对象后添加配置CorsConfiguration config = new CorsConfiguration();//设置放行哪些原始域//config.addAllowedOrigin("*"); // 旧版本config.addAllowedOriginPattern("*"); //新版本//放行哪些原始请求头部信息config.addAllowedHeader("*");//暴露哪些头部信息config.addExposedHeader("*");//放行哪些请求方式config.addAllowedMethod("GET"); //getconfig.addAllowedMethod("PUT"); //putconfig.addAllowedMethod("POST"); //postconfig.addAllowedMethod("DELETE"); //delete//corsConfig.addAllowedMethod("*"); //放行全部请求//是否发送Cookieconfig.setAllowCredentials(true);//2. 添加映射路径UrlBasedCorsConfigurationSource corsConfigurationSource =new UrlBasedCorsConfigurationSource();corsConfigurationSource.registerCorsConfiguration("/**", config);//返回CorsFilterreturn new CorsFilter(corsConfigurationSource);}
}
在SpringBoot2.4.4之后，当allowCredentials为true时，alloedOrigins不能包含特殊值“*”，因为该值不能在“Access-Control-Allow-Origin”响应头部中设置。要允许凭据访问一组来源，请显式列出它们或考虑改用“AllowedOriginPatterns”。
上面自定义Filter解析跨域的代码也可以写成如下形式：
@WebFilter
@Configuration
public class CorsFilter implements Filter {@Overridepublic void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {HttpServletResponse response = (HttpServletResponse) res;response.setHeader("Access-Control-Allow-Origin","*");response.setHeader("Access-Control-Allow-Credentials", "true");response.setHeader("Access-Control-Allow-Methods", "POST, GET, PATCH, DELETE, PUT");response.setHeader("Access-Control-Max-Age", "3600");
// response.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");response.setHeader("Access-Control-Allow-Headers", "access-control-allow-origin, authority, content-type, version-info, X-Requested-With");chain.doFilter(req, res);}
}
方法三：@CrossOrigin注解（局部跨域）
在Controller类或者处理用户请求的方法上加@CrossOrigin注解。
假设前端请求页面的网址为：http://localhost:63342/kuayu/frontend/demo.html，则：
@CrossOrigin(origins = "http://localhost:63342", maxAge = 3600)
@RestController
public class DemoController {@RequestMapping("/fun")public String fun(String p){System.out.println("param "+p);return "{\"name\":\"zhangsan\"}";}
}
【精品】SpringBoot跨域请求 解决方案汇总相关推荐
- 跨域请求解决方案及详解
1. 什么是跨域 跨域,是指浏览器不能执行其他网站的脚本.它是由浏览器的同源策略造成的,是浏览器对JavaScript实施的安全限制. 同源策略限制了一下行为: Cookie.LocalStorage ...
- Node.js跨域请求解决方案
Node.js跨域请求解决方案 一.缘由: 初到公司,老大让去解决之前项目客户提出的一个小问题,对某一模块进行访问验证,之前的项目是PHP做的,对此不了解,因此不打算先学习PHP再去解决问题,考虑到客 ...
- JS跨域请求解决方案-CORS
文章目录 JS跨域请求解决方案-CORS 1.JS跨域请求 测试JavaScript的跨域请求(失败) 2. 跨域解决方案CORS 普通实现方法 springMVC的跨域请求注解 3.分布式Id解决方 ...
- SpringBoot跨域请求
在软件开发过程中,尤其是现在的前后端分离开发,跨域请求是很普通的事情,我这个只是简单的将所有的跨域请求都接受,如若有大佬有更好的解决方案欢迎分享 问题: 在请求的时候,前端使用js进行ajax请求未能 ...
- Ajax跨域请求解决方案——jsonp
转自:http://www.cnblogs.com/dowinning/archive/2012/04/19/json-jsonp-jquery.html 1.一个众所周知的问题,Ajax直接请求普通 ...
- 同源策略和跨域请求解决方案
一.一个源的定义 如果两个页面的协议,端口(如果有指定)和域名都相同,则两个页面具有相同的源. 举个例子: 下表给出了相对http://a.xyz.com/dir/page.html同源检测的示例: ...
- vue 跨域请求解决方案
什么是跨域 现代浏览器出于安全考虑,都会去遵守一个叫做"同源策略"的约定,同源的意思是两个地址的协议.域名.端口号都相同的情况下,才叫同源.这个时候两个地址才可以相互访问 cook ...
- springboot + vue项目跨域请求解决方案
https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS 以下是跨域解决方案 服务端添加一个拦截器即可 @Compon ...
- SpringBoot 跨域请求
问题 @RequestMapping("/demo") @RestController public class CorsTestController {@GetMapping(& ...
最新文章
- RANSC算法（随机样本一致性）
- think php a方法,ThinkPHP之A方法实例讲解_PHP
- thinkphp5使用腾讯地图获取指定地址坐标：经纬度
- Kubernetes 1.5部署sonarqube
- Linux shell命令最常用的快捷键
- 2pin接口耳机_拆解报告：雷柏首款真无线耳机XS200
- 工作387-vant控制日期范围
- SegmentFault 美团云采访实录
- crt 8.7.3 黑暗模式_民谣缠绕厄运金属，抒情中的黑暗故事
- pytorch中查看可训练参数
- 【Drools一】值得打工人学习的规则引擎Drools
- 特朗普社交应用登苹果App Store下载量榜首
- 【实验技术笔记】细胞表型检测之细胞增殖（CCK-8法 + BrdU掺入法 + 平板克隆）
- 如何截图一张完整的表_表格太长怎么截图
- Python书单推荐
- 1062 最简分数 python
- 【码农学编曲】吉他伴奏
- 初中计算机试题戏曲进校园,戏曲进校园的作文（精选5篇）
- 二项式系数（枚举+二分+二项式定理）
- 用JSP-Servlet构建三层式管理信息系统