springBoot 解決前後端分離項目中跨越請求，同源策略

今天在做項目的過程，採用前後端分離技術的時遇到採用ajax請求無法訪問後臺介面，按F12，查看瀏覽器運行狀態時，報如下錯誤

為瞭解決瀏覽的同源策略，就必須瞭解什麼是同源策略。

1.什麼是同源策略

同源策略(Same origin policy)是一種約定，它是瀏覽器最核心也最基本的安全功能，如果缺少了同源策略，則瀏覽器的正常功能可能都會受到影響。可以說Web是構建在同源策略基礎之上的，瀏覽器只是針對同源策略的一種實現。

而所謂同源是指，功能變數名稱，協議，埠相同。如靜態資源所在的伺服器和後端介面所在伺服器不是同一個伺服器時，必然需要跨域獲取數據

2.解決同源策略，實現數據的跨院問題的方法

package com.example.bookdinner;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.context.annotation.Bean;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;


@SpringBootApplication
public class BookdinnerApplication {

    public static void main(String[] args) {
        SpringApplication.run(BookdinnerApplication.class, args);
    }
    
    private CorsConfiguration buildConfig() {
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        corsConfiguration.addAllowedOrigin("*");
        corsConfiguration.addAllowedHeader("*");
        corsConfiguration.addAllowedMethod("*");
        return corsConfiguration;
    }
    /**
     * 跨域過濾器
     * @return
     */
    @Bean
    public CorsFilter corsFilter() {
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", buildConfig()); // 4
        return new CorsFilter(source);
    }

}

將代碼編寫完後，重啟後臺服務，便可以解決同源策略問題，此時便可以訪問後臺的介面。

此方法可行，筆者親身嘗試過