首先,在解決之個問題之前,我們要弄明白爲什麼會出現跨域問題。
跨域問題是瀏覽器對於ajax請求的一種安全限制:
一個頁面發起的ajax請求,只能是與當前頁域名相同的路徑,這能有效的阻止跨站攻擊。
因此: 跨域問題 是針對ajax的一種限制
跨域的原因
一、域名不同
例:www.baidu.com 與www.taobao.com
二、域名相同,但是端口不同
例: www.baidu.com:8080 與 www.baidu.com:8081
三、二級域名不同
例: tieba.baidu.com 與 baike.baidu.com
四、https和http也屬於跨域
例:http://www.baidu.com 與 https://www.baidu.com
域名和端口相同,請求路徑不同不屬於跨域
例: www.baidu.com/tieba 與 www.baidu.com/baike
解決跨域問題的方案
在這我們採用 cors跨域資源共享(Cross-origin resource sharing),當然你也可以使用nginx反向代理和一些其他的方法,在這我們主要了解cors。
它允許瀏覽器向跨源服務器,發出XML HttpRequest請求,從而克服了AJAX只能同源使用的限制。
第一種方式:寫一個配置類
@Configuration
public class CorsConfig {
@Bean
public CorsFilter corsFilter() {
//1.添加CORS配置信息
CorsConfiguration config = new CorsConfiguration();
//1) 允許的域,不要寫*,否則cookie就無法使用了
config.addAllowedOrigin("http://manage.leyou.com");
//2) 是否發送Cookie信息
config.setAllowCredentials(true);
//3) 允許的請求方式
config.addAllowedMethod("OPTIONS");
config.addAllowedMethod("HEAD");
config.addAllowedMethod("GET");
config.addAllowedMethod("PUT");
config.addAllowedMethod("POST");
config.addAllowedMethod("DELETE");
config.addAllowedMethod("PATCH");
// 4)允許的頭信息
config.addAllowedHeader("*");
//2.添加映射路徑
UrlBasedCorsConfigurationSource configSource = new UrlBasedCorsConfigurationSource();
configSource.registerCorsConfiguration("/**", config);
//3.返回新的CorsFilter.
return new CorsFilter(configSource);
}
}
第二種方式直接在方法上加**@CrossOrigin**註解