spring 跨域 CORS (Cross Origin Resources Share) 跨域

Spring提供了三种方式跨域

1、CorsFilter 过滤器

2、<mvc:cors> Bean（全局，推荐使用）

3、@CrossOrigin注解

以上三种方式本质都是用来配置CorsConfiguration

1、CorsFilter 过滤器

首先创建一个自己的过滤器

这里我创建一个类，名字为MyCorsFilter

import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;

import java.util.Collections;

public class MyCorsFilter extends CorsFilter {
    public MyCorsFilter() {
        super(configurationSource());
    }
    private static UrlBasedCorsConfigurationSource configurationSource(){

        UrlBasedCorsConfigurationSource source=new UrlBasedCorsConfigurationSource();
        CorsConfiguration corsConfiguration=new CorsConfiguration();
                                                                   /*
                                                                    *允许跨域的地址
                                                                    *http://127.0.0.1:8848*/
        corsConfiguration.setAllowedOrigins(Collections.singletonList("http://127.0.0.1:8848"));
        corsConfiguration.setAllowCredentials(true);
        //允许跨域的路径
        source.registerCorsConfiguration("/tagc",corsConfiguration);
        return source;
    }
}

View Code

创建好后，进行在web.xml文件进行配置

<filter>
        <filter-name>cors</filter-name>
        <!--过滤器地址-->
        <filter-class>com.wbg.maven1128.controller.MyCorsFilter</filter-class>
    </filter>
    <filter-mapping>
        <filter-name>cors</filter-name>
        <!--拦截所有-->
        <url-pattern>/*</url-pattern>
    </filter-mapping>

View Code

2、<mvc:cors> Bean（全局，推荐使用）

在spring-web里面进行配置

    <mvc:cors>
        <mvc:mapping path="/taga"
                     allowed-origins="http://127.0.0.1:8020"
                     allowed-methods="POST,GET, OPTIONS,DELETE,PUT"
                     allowed-headers="Content-Type,ContentType,Access-Control-Allow-Headers, Authorization, X-Requested-With"
                     allow-credentials="true"/>
    </mvc:cors>

View Code

3、@CrossOrigin注解

定义在类上，所有方法有效，@CrossOrigin不带参数就是默认

定义在方法上，该方法有效

测试页面

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <script src="http://code.jquery.com/jquery.js"></script>
    <body>
    <button onclick="aa() ">开始</button>
<script>

    function aa(){
        if(window.confirm("是否发送？")){

        fetch("http://localhost:8080/taga",{
            method:"get"
        }).then(function(res){
            resp.text().then(function(data){
                console.log(data);
            });
        })
        }
        else {
            fetch("http://localhost:8080/tagb",{
                method:"get"
            }).then(function(res){
                res.text().then(function(data){
                    console.log(data);
                })
                
            })
        }
    }
</script>
    </body>
</html>

View Code

跨域