1. 程式人生 > >Spring Boot CORS支持

Spring Boot CORS支持

ins $.ajax 跨域問題 ram sso nbsp 普通 實現 pin

一、Web開發經常會遇到跨域問題,解決方案有:jsonp,iframe,CORS等

CORS與JSONP相比
1、JSONP只能實現GET請求,而CORS支持所有類型的HTTP請求。
2、使用CORS開發者可以使用普通的XMLHttpRequest發起請求和獲得數據,比起JSONP有更好的錯誤處理。
3、JSONP主要被老的瀏覽器支持,它們往往不支持CORS,而絕大多數現代瀏覽器都已經支持了CORS

二、在SpringMVC中可以配置全局的規則,也可以使用@CrossOrigin 註解進行細粒度的配置。

1、使用全局配置的方式:

  在端口為8080的應用中配置:

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration; import org.springframework.web.servlet.config.annotation.CorsRegistry; import org.springframework.web.servlet.config.annotation.WebMvcConfigurer; import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter; @Configuration
public class CustomCorsConfiguration { @Bean public WebMvcConfigurer corsConfigurer() { return new WebMvcConfigurerAdapter() { @Override public void addCorsMappings(CorsRegistry registry) { registry.addMapping("/api/**").allowedOrigins("http://localhost:9090");//意思是允許端口為9090的引用訪問localhost:8080/api/下所有的路徑 } }; } }

  在端口為8080的應用中提供一個接口示例:

@RestController
@RequestMapping("/api")
public class ApiController {

    @PostMapping("/get")
    public Map<String, Object> get(String name) {
        Map<String, Object> map = new HashMap<>();
        map.put("name", name);
        return map;
    }
}

  在端口為9090的應用中提供一個訪問入口:

<h1 id="title">跨域訪問</h1>
<script type="text/javascript">
    $(function () {
        $("#title").click(function () {
            alert("click");
            $.ajax({
                url: "http://localhost:8080/api/get",
                type: "post",
                data: {
                    name: "測試"
                },
                success: function (data, status, xhr) {
                    console.log(data);
                    alert(data.name);
                }
            });
        });
    });
</script>

---------------------------------

  全局配置的方式也可以采用繼承的方式來實現:

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

@Configuration
public class CustomCorsConfiguration extends WebMvcConfigurerAdapter {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/api/**").allowedOrigins("http://localhost:9090");
    }
}

---------------------------------

 2、使用@CrossOrigin 註解進行細粒度的配置:

@RestController
@RequestMapping("/api")
public class ApiController {

    @CrossOrigin(origins = "http://localhost:8080")
    @PostMapping("/get")
    public Map<String, Object> get(String name) {
        Map<String, Object> map = new HashMap<>();
        map.put("name", name);
        return map;
    }
}

Spring Boot CORS支持