解决Vue+springboot（前后端分离）项目的跨域问题

*解决Vue+springboot（前后端分离）项目的跨域问题

一、产生跨域问题的原因
浏览器的为了安全设置的同源策略机制
同源策略：协议、域名、端口号必须同源，否则无法进行访问（如果你能访问任意不同源的服务，岂不是乱了）
二、解决方案(每个都是独立解决方案)
1、前端解决（这里我针对前端解决，利用代理的方式解决，我用vue项目，其他的大同小异）
建立vue配置文件（vue.config.js）

module.exports = {
    devServer: {
        proxy: {
            '/api': {    //所有发送给后台的请求，设置url的前缀为/api
                    target: 'http://localhost:8888',   //指定后台服务的访问地址
                    changeOrigin: true,  //允许修改请求头
                    pathRewrite: {
						'^/api': ''
                    }   
            }
        }
      }
}

后端解决：
方式：CORS :跨域资源共享
2、springboot提供了一个注解@CrossOrigin(在controller层添加)
这个注解可以让外界直接访问到这个controller层（缺点：每个controller层都需要添加这个注解）
3、可以利用springboot的**@Configuration定义配置**，进行统一配置
比较常用

@Configuration
public class BaseConfig {
    @Bean
    CorsFilter getCorsFilter(){
        UrlBasedCorsConfigurationSource source=new UrlBasedCorsConfigurationSource();
        CorsConfiguration configuration=new CorsConfiguration();
        configuration.addAllowedMethod("*");//允许怎样的方法（post、get）通过
        configuration.addAllowedOrigin("*");//域名
        configuration.addAllowedHeader("*");//请求头
        source.registerCorsConfiguration("/**",configuration);
        return new CorsFilter(source);
    }
}

主流方法就这些，当然还有一些其他的方法(利用JSONP,这个的话只能是**get请求,**大概原理就是前端可以接受到固定格式的信息，后端的话就把信息封装成这个固定的格式就能返回了)