CORS(Cross-Origin Resource Sharing)"跨域资源共享",是一个W3C标准,它允许浏览器向跨域服务器发送Ajax请求,打破了Ajax只能访问本站内的资源限制,CORS在很多地方都有被使用,微信支付的JS支付就是通过JS向微信服务器发送跨域请求。开放Ajax访问可被跨域访问的服务器大大减少了后台开发的工作,前后台工作也可以得到很好的明确以及分工,下面我们就看讲一下如何让SpringBoot项目支持CORS跨域。

1、新建项目sc-cors,对应的pom.xml文件如下


    4.0.0

    spring-cloud
    sc-cors
    0.0.1-SNAPSHOT
    jar

    sc-cors
    http://maven.apache.org

    
        org.springframework.boot
        spring-boot-starter-parent
        2.0.4.RELEASE
    

    
        
            
                org.springframework.cloud
                spring-cloud-dependencies
                Finchley.RELEASE
                pom
                import
            

        
    

    
        UTF-8
        1.8
        1.8
    

    
        
            org.springframework.boot
            spring-boot-starter-web
        
    

2、新建配置类,配置满足什么的条件的可以跨域访问

package sc.cors.config;

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

@Configuration
public class CorsConfig implements WebMvcConfigurer{

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/cors/**")
        .allowedMethods("*")
        .allowedOrigins("*")
        .allowedHeaders("*");
    }
}

3、新建controller,包含一个可以跨域访问的资源,一个不可以跨域访问的资源

package sc.cors.controller;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import sc.cors.model.User;

@RestController
public class CorsController {

    @RequestMapping("/cors/getUserInfo")
    public Map getUserInfo() {
        Map resp = new HashMap();
        resp.put("code", "success");
        resp.put("message", "success");
        User user = new User();
        user.setId(1);
        user.setPosition("cto");
        user.setUserName("huang jinjin");
        resp.put("body", user);
        return resp;
    }

    @RequestMapping("/nocors/listUserInfo")
    public Map listUserInfo() {
        Map resp = new HashMap();
        resp.put("code", "success");
        resp.put("message", "success");
        List list = new ArrayList();
        User user = new User();
        user.setId(1);
        user.setPosition("cto");
        user.setUserName("huang jinjin");
        list.add(user);
        resp.put("body", list);
        return resp;
    }

}

4、其他项目文件如下图

36、SpringBoot配置Cors解决跨域请求_第1张图片
5、在新建一个项目sc-cors-web,该项目比较简单,包含一个比较重要的html文件





cors




    

备注:
sc-cors项目对应的端口为9088
sc-cors-web项目对应的端口为9087
6、分别启动项目sc-cors和sc-cors-web
7、验证跨域请求
访问http://127.0.0.1:9087/index.html
36、SpringBoot配置Cors解决跨域请求_第2张图片
点击CORS跨域请求getUserInfo
36、SpringBoot配置Cors解决跨域请求_第3张图片
点击CORS跨域请求listUserInfo
36、SpringBoot配置Cors解决跨域请求_第4张图片