浏览器同源策略 JS 跨域解决方案 Spring 中 CORS

CORS 是一个 W3C 标准,全称是 " 跨域资源共享 "(Cross-origin resource sharing)。CORS 需要浏览器和服务器同时支持。目前,所有浏览器都支持该功能,IE 浏览器不能低于 IE10。

浏览器同源策略 JS 跨域解决方案 Spring 中 CORS

它允许浏览器向跨源服务器,发出 XMLHttpRequest 请求,从而克服了 AJAX 只能同源 使用的限制。整个 CORS 通信过程,都是浏览器自动完成,不需要用户参与。对于开发者来 说,CORS 通信与同源的 AJAX 通信没有差别,代码完全一样。浏览器一旦发现 AJAX 请求跨 源,就会自动添加一些附加的头信息,有时还会多出一次附加的请求,但用户不会有感觉。 因此,实现 CORS 通信的关键是服务器。只要服务器实现了 CORS 接口,就可以跨源通信。

解决跨域其实很简单,以下示例在后端 Controller 层:

首先在类中注入 response

@Autowired
private HttpServletResponse response;

在需要跨域的方法里加上

        response.setHeader("Access-Control-Allow-Origin", "http://cway.top");// 可以访问的域 (当此方法不需要操作 cookie 则无需下面一行) 可以用 * 通配所有地址
        response.setHeader("Access-Control-Allow-Credentials", "true");// 如果操作 cookie,必须加上这句话, 操作 cookie 上面不能用通配符   必须固定网址 

由于操作 cookie,需要改下前端代码,在请求网址后面加 ,{'withCredentials':true}

$http.get('http://cway.top/?page='+$scope.num,{'withCredentials':true}).success(function(response){.......}
);

当然在 springMVC4.2 及以后版本添加了 Cros 注解,可以省去上述后端代码直接写注解

@CrossOrigin(origins="http://cway.top",allowCredentials="true")

其中 allowCredentials="true 缺省值就是 true,因此也可以省略不写,该注解可以加载方法上或类上,可以使用通配符例如 *


Spring MVC CORS 使用 WebMvcConfigurerAdapter

要为整个应用程序启用 CORS,请使用 WebMvcConfigurerAdapter  添加  CorsRegistry

@Configuration
@EnableWebMvc
public class CorsConfiguration extends WebMvcConfigurerAdapter
{
    @Override
    public void addCorsMappings(CorsRegistry registry) {        registry.addMapping("/**")
                .allowedMethods("GET", "POST");
    }
}

Spring Boot CORS 使用 WebMvcConfigurer 配置

在 spring boot 应用程序中,建议只声明一个 WebMvcConfigurer bean。

@Configuration
public class CorsConfiguration
{
    @Bean
    public WebMvcConfigurer corsConfigurer()
    {        return new WebMvcConfigurerAdapter() {
            @Override
            public void addCorsMappings(CorsRegistry registry) {                registry.addMapping("/**");
            }
        };
    }
}

或者直接注入 CorsConfiguration:

@Configuration
public class CORSConfiguration {    private CorsConfiguration buildConfig() {        CorsConfiguration corsConfiguration = new CorsConfiguration();
        // 允许任何域名访问
        corsConfiguration.addAllowedOrigin("*");
        // 允许任何 header 访问
        corsConfiguration.addAllowedHeader("*");
        // 允许任何方法访问
        corsConfiguration.addAllowedMethod("*");
        //  允许 cookies 跨域
        corsConfiguration.setAllowCredentials(true);
        //  预检请求的缓存时间(秒),即在这个时间段里,对于相同的跨域请求不会再预检了
        corsConfiguration.setMaxAge(18000L);
        return corsConfiguration;
    }

    @Bean
    public CorsFilter corsFilter() {        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", buildConfig());
        return new CorsFilter(source);
    }
}

CORS 使用 Spring Security 配置

要通过 Spring 安全性启用 CORS 支持,请配置 CorsConfigurationSource bean 并使用 HttpSecurity.cors()  配置

@EnableWebSecurity
public class WebSecurityConfig extends WebSecurityConfigurerAdapter {
 
    @Override
    protected void configure(HttpSecurity http) throws Exception {        http.cors().and()
            //other config
    }
 
    @Bean
    CorsConfigurationSource corsConfigurationSource()
    {        CorsConfiguration configuration = new CorsConfiguration();
        configuration.setAllowedOrigins(Arrays.asList("https://example.com"));
        configuration.setAllowedMethods(Arrays.asList("GET","POST"));
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", configuration);
        return source;
    }
}

部分参考来源:http://www.leftso.com/blog/303

手机扫描二维码访问

本文标题:《浏览器同源策略 JS 跨域解决方案 Spring 中 CORS》作者:极四维博客
原文链接:https://cway.top/post/539.html
特别注明外均为原创,转载请注明。

分享到微信

扫描二维码

可在微信查看或分享至朋友圈。

相关文章

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

«    2024年10月    »
123456
78910111213
14151617181920
21222324252627
28293031

搜索

控制面板

您好,欢迎到访网站!
  查看权限

最新留言

文章归档

  • 订阅本站的 RSS 2.0 新闻聚合