1004-設置跨域配置實現前後端聯調

一、前端網站app.js

window.app = {
    /* 開發環境 */
    serverUrl: "http://localhost:8088",                                   // 接口服務接口地址
    paymentServerUrl: "http://192.168.1.3:8089",                            // 支付中心服務地址
    shopServerUrl: "http://localhost:8080/foodie-shop/",                  // 門戶網站地址
    centerServerUrl: "http://localhost:8080/foodie-center/",              // 用戶中心地址
    cookieDomain: "",    
	......
	......
	......
}

二、後端新增配置類

package com.imooc.config;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;

@Configuration
public class CorsConfig {

    public CorsConfig() {
    }

    @Bean
    public CorsFilter corsFilter() {
        // 1. 添加cors配置信息
        CorsConfiguration config = new CorsConfiguration();
        config.addAllowedOrigin("http://localhost:8080");
//        config.addAllowedOrigin("http://shop.z.mukewang.com:8080");
//        config.addAllowedOrigin("http://center.z.mukewang.com:8080");
//        config.addAllowedOrigin("http://shop.z.mukewang.com");
//        config.addAllowedOrigin("http://center.z.mukewang.com");
        config.addAllowedOrigin("*");

        // 設置是否發送cookie信息
        config.setAllowCredentials(true);

        // 設置允許請求的方式
        config.addAllowedMethod("*");

        // 設置允許的header
        config.addAllowedHeader("*");

        // 2. 爲url添加映射路徑
        UrlBasedCorsConfigurationSource corsSource = new UrlBasedCorsConfigurationSource();
        corsSource.registerCorsConfiguration("/**", config);

        // 3. 返回重新定義好的corsSource
        return new CorsFilter(corsSource);
    }
}

說明：
其中8088是後端啓動的tomcat端口。
8080是前端啓動的tomcat端口。

ajax中進行調試的話，可以使用 關鍵字 debugger;