关于前后端跨域问题：

举例几个本人平时用的方法，其实还有很多种解决跨域请求的方法，先列举几个：

1.可以在后端的服务端增加跨域支持：

@Configuration
public class CorsConfig implements WebMvcConfigurer {

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

这种方式相当于全局过滤器，对所有请求都进行拦截，过滤一遍

2.也可以在前端设置拦截器，在vue.config.js

//引入axios
import axios from "axios";
//通过axios创建对象-request对象,用于发送请求到后端
const request = axios.create({
    timeout: 5000
})

//request拦截器的处理
request.interceptors.request.use(config => {
    config.headers['Content-Type'] = 'application/json;charset=utf-8'
    return config
}, error => {
    return Promise.reject(error)
})
//response拦截器
//可以在调用接口响应后，统一的处理返回结果
request.interceptors.response.use(
    response => {
        let res = response.data
        //如果返回的是文件,就返回
        if (response.config.responseType === 'blob') {
            return res
        }
        //如果是string, 就转成json对象
        if (typeof res === 'string') {
            //如果res 不为null, 就进行转换成json对象
            res = res ? JSON.parse(res) : res
        }
        return res;
    },
    error => {
        console.log("err", error)
        return Promise.reject(error);
    }
)
//导出request对象, 在其它文件就可以使用
export default request

<script>
// 引入 request 组件
import request from "@/utils/request";
//methods 增加方法. save() {
// =======说明====... request.post("http://localhost:10001/save", this.form).then(res => {
console.log(res)
this.dialogVisible = false
})
}

配置完拦截器，进行设置前后端的接口需要的设置

// 跨域配置
module.exports = {
devServer: {
port: 5927, //设置本地默认端口, 选填
proxy: { //设置代理，必须填
'/api': { //设置拦截器 拦截器格式 斜杠+拦截器名字，名字可以
自己定
target: 'http://localhost:10001/', // 代 理 的 目 标 地 址 , 就 是 /api 代 替
http://localhost:10001/
changeOrigin: true, //是否设置同源，输入是的
pathRewrite: { //路径重写
'/api': '' //选择忽略拦截器里面的单词
}
}
}
}
}