1. 程式人生 > >解決angular+spring boot的跨域問題

解決angular+spring boot的跨域問題

  產生跨域訪問的情況主要是因為請求的發起者與請求的接受者1、域名不同;2、埠號不同

  下面給出詳細步驟:

  1. 如果要用到Cookie,那麼需要在前端設定.withCredentials=true
  2. 在後端寫一個配置類CorsConfig,這個類繼承WebMvcConfigurerAdapter,在裡面進行後臺跨域請求配置。
下面給出相應程式碼 js中的配置全域性$http請求的程式碼:
    var utils = angular.module('ecnuUtils', ['ngCookies', 'ngStorage']);
    utils.config(['$httpProvider', config]);

    function config($httpProvider) {
        $httpProvider.defaults.withCredentials = true;
        $httpProvider.defaults.headers.common = { 'Access-Control-Allow-Origin' : '*' }
    }



CorsConfig的程式碼:
package edu.ecnu.yjsy.conf;

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 CorsConfig extends WebMvcConfigurerAdapter {

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("*")
                .allowCredentials(true)
                .allowedMethods("GET", "POST", "DELETE", "PUT")
                .maxAge(3600);
    }

}