CORS（Cross-Origin Resource Sharing）”跨域資源共享”，是一個W3C標準，它允許瀏覽器向跨域伺服器傳送Ajax請求，打破了Ajax只能訪問本站內的資源限制。我們在開發中都會遇到前端請求後臺伺服器出現跨域錯誤，下面我就講一下如何讓你的SpringBoot專案支援CORS跨域。

第一步 搭建SpringBoot專案

怎麼搭建一個SpringBoot專案及新增相關依賴，我在這裡就不細說了，相信對各位來說都是小菜。

第二步 配置CORSConfiguration

新建一個類CORSConfiguration，繼承WebMvcConfigurerAdapter，並重寫addCorsMappings方法。

@Configuration
public class CORSConfiguration extends WebMvcConfigurerAdapter{
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedMethods("*")
                .allowedOrigins("*")
                .allowedHeaders("*");
        super
 
.addCorsMappings(registry);
    }
}

配置的詳細資訊說明如下：
addMapping：配置可以被跨域的路徑，可以任意配置，可以具體到直接請求路徑。
allowedMethods：允許所有的請求方法訪問該跨域資源伺服器，如：POST、GET、PUT、DELETE等。
allowedOrigins：允許所有的請求域名訪問我們的跨域資源，可以固定單條或者多條內容，如：”http://www.aaa.com“，只有該域名可以訪問我們的跨域資源。
allowedHeaders：允許所有的請求header訪問，可以自定義設定任意請求頭資訊。

到此我們的配置就完成了，是不是很簡單呢？下面進行測試。

第三步 測試

①. 新建一個IndexController，接收一個/cors請求。

@RestController
public class IndexController {

    @RequestMapping(value = "/cors")
    public String corsIndex(){
        return "hello,this is cors test!";
    }

}

②..新建一個login.html，點選登入按鈕就會觸發下面的請求。

 <script>
        $(function(){
            $('.login_btn').click(function(){
                $.ajax({
                    url: 'http://192.168.1.104:8080/cors',
                    success: function(data){
                        alert(data);
                    }
                })
            });
        });
    </script>

③. 然後我在同一個區域網的另一臺電腦上訪問login.html，結果如下:

跨域訪問成功！

④. 我將CORSConfiguration 的配置資訊註釋掉。

然後訪問login.html，結果如下:

訪問失敗，根據失敗資訊，可以得知不允許跨域訪問。