溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
springboot解決跨域問題的案例？這個問題可能是我們日常學習或工作經常見到的。希望通過這個問題能讓你收獲頗深。下面是小編給大家帶來的參考內容，讓我們一起來看看吧！
一、什么是跨域HTTP請求
現代瀏覽器出于安全的考慮，使用 XMLHttpRequest對象發起 HTTP請求時必須遵守同源策略，否則就是跨域的HTTP請求，默認情況下是被禁止的。跨域HTTP請求是指A域上資源請求了B域上的資源，舉例而言，部署在A機器上Nginx上的js代碼通過ajax請求了部署在B機器Tomcat上的RESTful接口。（推薦：Java視頻教程）
IP（域名）不同、或者端口不同，都會造成跨域問題。為了解決跨域的問題，曾經出現過jsonp、代理文件等方案，應用場景受限，維護成本高，直到HTML5帶來了CORS協議。
CORS是一個W3C標準，全稱是”跨域資源共享”（Cross-origin resource sharing），允許瀏覽器向跨源服務器，發出XMLHttpRequest請求，從而克服了AJAX只能同源使用的限制。它通過服務器增加一個特殊的Header[Access-Control-Allow-Origin]來告訴客戶端跨域的限制，如果瀏覽器支持CORS、并且判斷Origin通過的話，就會允許XMLHttpRequest發起跨域請求。
CROS常見header
Access-Control-Allow-Origin:http://somehost.com 表示允許http://somehost.com發起跨域請求。
Access-Control-Max-Age:86400 表示在86400秒內不需要再發送預校驗請求。
Access-Control-Allow-Methods: GET,POST,PUT,DELETE 表示允許跨域請求的方法。
Access-Control-Allow-Headers: content-type 表示允許跨域請求包含content-type
二、CORS實現跨域訪問
授權方式
方式1：返回新的CorsFilter
方式2：重寫WebMvcConfigurer
方式3：使用注解（@CrossOrigin）
方式4：手工設置響應頭（HttpServletResponse ）
注：方式1和方式2屬于全局CORS配置，方式3和方式4屬于局部CORS配置。如果使用了局部跨域是會覆蓋全局跨域的規則，所以可以通過@CrossOrigin注解來進行細粒度更高的跨域資源控制。
1.返回新的CorsFilter(全局跨域)
package com.hehe.yyweb.config;
@Configuration
public class GlobalCorsConfig {
@Bean
public CorsFilter corsFilter() {
//1.添加CORS配置信息
CorsConfiguration config = new CorsConfiguration();
//放行哪些原始域
config.addAllowedOrigin("*");
//是否發送Cookie信息
config.setAllowCredentials(true);
//放行哪些原始域(請求方式)
config.addAllowedMethod("*");
//放行哪些原始域(頭部信息)
config.addAllowedHeader("*");
//暴露哪些頭部信息（因為跨域訪問默認不能獲取全部頭部信息）
config.addExposedHeader("*");
//2.添加映射路徑
UrlBasedCorsConfigurationSource configSource = new UrlBasedCorsConfigurationSource();
configSource.registerCorsConfiguration("/**", config);
//3.返回新的CorsFilter.
return new CorsFilter(configSource);
}
}2. 重寫WebMvcConfigurer（全局跨域）
任意配置類，返回一個新的WebMvcConfigurer Bean，并重寫其提供的跨域請求處理的接口，目的是添加映射路徑和具體的CORS配置信息。
package com.hehe.yyweb.config;
@Configuration
public class GlobalCorsConfig {
@Bean
public WebMvcConfigurer corsConfigurer() {
return new WebMvcConfigurer() {
@Override
//重寫父類提供的跨域請求處理的接口
public void addCorsMappings(CorsRegistry registry) {
//添加映射路徑
registry.addMapping("/**")
//放行哪些原始域
.allowedOrigins("*")
//是否發送Cookie信息
.allowCredentials(true)
//放行哪些原始域(請求方式)
.allowedMethods("GET","POST", "PUT", "DELETE")
//放行哪些原始域(頭部信息)
.allowedHeaders("*")
//暴露哪些頭部信息（因為跨域訪問默認不能獲取全部頭部信息）
.exposedHeaders("Header1", "Header2");
}
};
}
}在方法上（@RequestMapping）使用注解 @CrossOrigin ：
@RequestMapping("/hello")
@ResponseBody
@CrossOrigin("http://localhost:8080")
public String index( ){
return "Hello World";
}或者在控制器（@Controller）上使用注解 @CrossOrigin ：
@Controller
@CrossOrigin(origins = "http://xx-domain.com", maxAge = 3600)
public class AccountController {
@RequestMapping("/hello")
@ResponseBody
public String index( ){
return "Hello World";
}
}使用HttpServletResponse對象添加響應頭（Access-Control-Allow-Origin）來授權原始域，這里Origin的值也可以設置為"*" ，表示全部放行。
@RequestMapping("/hello")
@ResponseBody
public String index(HttpServletResponse response){
response.addHeader("Access-Control-Allow-Origin", "http://localhost:8080");
return "Hello World";
}三、測試跨域訪問
首先使用 Spring Initializr 快速構建一個Maven工程，什么都不用改，在static目錄下，添加一個頁面：index.html 來模擬跨域訪問。目標地址: http://localhost:8090/hello
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<title>Page Index</title>
</head>
<body>
<h3>前臺系統</h3>
<p id="info"></p>
</body>
<script src="webjars/jquery/3.2.1/jquery.js"></script>
<script>
$.ajax({
url: 'http://localhost:8090/hello',
type: "POST",
xhrFields: {
withCredentials: true //允許跨域認證
},
success: function (data) {
$("#info").html("跨域訪問成功:"+data);
},
error: function (data) {
$("#info").html("跨域失敗!!");
}
})
</script>
</html>然后創建另一個工程，在Root Package添加Config目錄并創建配置類來開啟全局CORS。
package com.hehe.yyweb.config;
@Configuration
public class GlobalCorsConfig {
@Bean
public WebMvcConfigurer corsConfigurer() {
return new WebMvcConfigurer() {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**");
}
};
}
}接著，簡單編寫一個Rest接口 ，并指定應用端口為8090。
package com.hehe.yyweb;
@SpringBootApplication
@RestController
public class YyWebApplication {
@Bean
public TomcatServletWebServerFactory tomcat() {
TomcatServletWebServerFactory tomcatFactory = new TomcatServletWebServerFactory();
tomcatFactory.setPort(8090); //默認啟動8090端口
return tomcatFactory;
}
@RequestMapping("/hello")
public String index() {
return "Hello World";
}
public static void main(String[] args) {
SpringApplication.run(YyWebApplication.class, args);
}
}最后分別啟動兩個應用，然后在瀏覽器訪問：http://localhost:8080/index.html ，可以正常接收JSON數據，說明跨域訪問成功！！
感謝各位的閱讀！看完上述內容，你們對springboot解決跨域問題的案例大概了解了嗎？希望文章內容對大家有所幫助。如果想了解更多相關文章內容，歡迎關注億速云行業資訊頻道。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
