一：問題描述
跨域問題指的是瀏覽器的同源策略導致頁面訪問服務器報錯的一系列問題。而同源策略指的是以下方式：
DOM同源策略：禁止對不同源頁面DOM進行操作。這裡主要場景是iframe跨域的情況，不同域名的iframe是限制互相訪問的。
XmlHttpRequest同源策略：禁止使用XHR對象向不同源的服務器地址發起HTTP請求。
二：解決方案
1：在服務器響應的時候加上response.setHeader("Access-Control-Allow-Origin", "*");
2：客戶端與服務器端同時加一個callBcak函數，jsonp
3：利用spring4.2的新特性
3.1:xml配置
3.2：註解
@CrossOrigin
4.springBoot結合攔截器配置
4.1、定義一個Interceptor攔截器
借用攔截器的preHandle方法，預先處理客戶端的各種請求。
public class CrossInterceptor implements HandlerInterceptor { @Override public boolean preHandle(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, Object o) throws Exception { // 跨域資源共享（ cors ） String origin = httpServletRequest.getHeader("Origin"); httpServletResponse.setHeader("Access-Control-Allow-Origin", origin); //允許的方法 httpServletResponse.setHeader("Access-Control-Allow-Methods", "*"); //允許的頭部參數 httpServletResponse.setHeader("Access-Control-Allow-Headers", "Origin,Content-Type,Accept,X-os,X-uid,X-token,X-role,X-Requested-With"); //用戶代理是否應該在跨域請求的情況下從其他域發送cookies httpServletResponse.setHeader("Access-Control-Allow-Credentials", "true"); return true; } }4.2、攔截器注入配置
@Configuration @EnableWebMvc @ComponentScan("com.recruit") public class WebAppConfig extends WebMvcConfigurerAdapter { @Bean public AuthenticationInterceptor authenticationInterceptor() { return new AuthenticationInterceptor(); } @Override public void addInterceptors(InterceptorRegistry registry) { //分頁攔截器 registry.addInterceptor(new PaginationInterceptor()).addPathPatterns("/**"); //跨域攔截器 registry.addInterceptor(new CrossInterceptor()).addPathPatterns("/**"); //權限攔截器 registry.addInterceptor(authenticationInterceptor()).addPathPatterns("/**"); super.addInterceptors(registry); } }
分享到:
閱讀更多 程序員Nicky 的文章
