devServer: {
    // 其他代碼省略。。。。。
    // 代理配置
    proxy: {
      // 代理服務(wù)器，當(dāng)請求的網(wǎng)址是http://localhost:3000的時候，會轉(zhuǎn)成http://192.168.80.115:3000
      // /api 是 看接口文檔所寫的，每當(dāng)訪問本地的/api接口時，會轉(zhuǎn)化為訪問真實的服務(wù)器
      '/api': {
        target: 'http://localhost:3000' // 我們要代理的真實接口地址
      }
    }

var xhr = new XMLHttpRequest();
// 前端開關(guān)：瀏覽器是否讀寫cookie
xhr.withCredentials = true;
// 訪問http-proxy-middleware代理服務(wù)器
xhr.open('get', 'http://www.domain1.com:3000/login?user=admin', true);
xhr.send();

var express = require('express');
var proxy = require('http-proxy-middleware');
var app = express();
app.use('/', proxy({
    // 代理跨域目標(biāo)接口
    target: 'http://www.domain2.com:8080',
    changeOrigin: true,
    // 修改響應(yīng)頭信息，實現(xiàn)跨域并允許帶cookie
    onProxyRes: function(proxyRes, req, res) {
        res.header('Access-Control-Allow-Origin', 'http://www.domain1.com');
        res.header('Access-Control-Allow-Credentials', 'true');
    },
    // 修改響應(yīng)信息中的cookie域名
    cookieDomainRewrite: 'www.domain1.com'  // 可以為false，表示不修改
}));
app.listen(3000);
console.log('Proxy server is listen at port 3000...');

module.exports = {
    entry: {},
    module: {},
    ...
    devServer: {
        historyApiFallback: true,
        proxy: [{
            context: '/login',
            target: 'http://www.domain2.com:8080',  // 代理跨域目標(biāo)接口
            changeOrigin: true,
            secure: false,  // 當(dāng)代理某些https服務(wù)報錯時用
            cookieDomainRewrite: 'www.domain1.com'  // 可以為false，表示不修改
        }],
        noInfo: true
    }
}

 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 {
    // 當(dāng)前跨域請求最大有效時長。這里默認(rèn)1天
    private static final long MAX_AGE = 24 * 60 * 60;
    @Bean
    public CorsFilter corsFilter() {
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        corsConfiguration.addAllowedOrigin("*"); // 1 設(shè)置訪問源地址
        corsConfiguration.addAllowedHeader("*"); // 2 設(shè)置訪問源請求頭
        corsConfiguration.addAllowedMethod("*"); // 3 設(shè)置訪問源請求方法
        corsConfiguration.setMaxAge(MAX_AGE);
        source.registerCorsConfiguration("/**", corsConfiguration); // 4 對接口配置跨域設(shè)置
        return new CorsFilter(source);
    }
}

import axios from 'axios'
const request = axios.create({
	baseURL: '/api',  // 注意??！ 這里是全局統(tǒng)一加上了 '/api' 前綴，也就是說所有接口都會加上'/api'前綴在，頁面里面寫接口的時候就不要加 '/api'了，否則會出現(xiàn)2個'/api'，類似 '/api/api/user'這樣的報錯，切記?。。?
    timeout: 5000
})
// request 攔截器
// 可以自請求發(fā)送前對請求做一些處理
// 比如統(tǒng)一加token，對請求參數(shù)統(tǒng)一加密
request.interceptors.request.use(config => {
    config.headers['Content-Type'] = 'application/json;charset=utf-8';
 // config.headers['token'] = user.token;  // 設(shè)置請求頭
    return config
}, error => {
    return Promise.reject(error)
});
// response 攔截器
// 可以在接口響應(yīng)后統(tǒng)一處理結(jié)果
request.interceptors.response.use(
    response => {
        let res = response.data;
        // 如果是返回的文件
        if (response.config.responseType === 'blob') {
            return res
        }
        // 兼容服務(wù)端返回的字符串?dāng)?shù)據(jù)
        if (typeof res === 'string') {
            res = res ? JSON.parse(res) : res
        }
        return res;
    },
    error => {
        console.log('err' + error) // for debug
        return Promise.reject(error)
    }
)
export default request

// 跨域配置
module.exports = {
    devServer: {                //記住，別寫錯了devServer//設(shè)置本地默認(rèn)端口  選填
        port: 9876,
        proxy: {                 //設(shè)置代理，必須填
            '/api': {              //設(shè)置攔截器  攔截器格式   斜杠+攔截器名字，名字可以自己定
                target: 'http://localhost:9999',     //代理的目標(biāo)地址
                changeOrigin: true,              //是否設(shè)置同源，輸入是的
                pathRewrite: {                   //路徑重寫
                    '^/api': ''                     //選擇忽略攔截器里面的內(nèi)容
                }
            }
        }
    }
}

import axios from 'axios'
const request = axios.create({
	baseURL: 'http://localhost:9090',  // 注意！！ 這里是全局統(tǒng)一加上了 后端接口前綴 前綴，后端必須進(jìn)行跨域配置！
    timeout: 5000
})
// request 攔截器
// 可以自請求發(fā)送前對請求做一些處理
// 比如統(tǒng)一加token，對請求參數(shù)統(tǒng)一加密
request.interceptors.request.use(config => {
    config.headers['Content-Type'] = 'application/json;charset=utf-8';
 // config.headers['token'] = user.token;  // 設(shè)置請求頭
    return config
}, error => {
    return Promise.reject(error)
});
// response 攔截器
// 可以在接口響應(yīng)后統(tǒng)一處理結(jié)果
request.interceptors.response.use(
    response => {
        let res = response.data;
        // 如果是返回的文件
        if (response.config.responseType === 'blob') {
            return res
        }
        // 兼容服務(wù)端返回的字符串?dāng)?shù)據(jù)
        if (typeof res === 'string') {
            res = res ? JSON.parse(res) : res
        }
        return res;
    },
    error => {
        console.log('err' + error) // for debug
        return Promise.reject(error)
    }
)
export default request