1 跨域

刚开始不做任何配置时 , 通过VUE调用SB的接口 , 就会报错:“…has been blocked by CORS policy”

什么意思?

后端实际上已经接收到请求 , 也完成了处理 , 返回了处理后的数据 , 但被浏览器拦截了.

浏览器为什么拦截?

浏览器的同源策略 : 限制不同源之间的交互 , 以避免不同源的攻击 . 必须符合同源策略的请求 , 才能相互访问

什么是同源策略?

协议+域名+端口 , 三个都相同时才为同源.

现在知道为什么访问不了了:

由于前后端分离 , 故两端的访问端口不一样 . VUE项目默认启动在8181端口 , 而SB默认启动在8080端口 , 不符合同源策略.

CORS跨域资源共享 , 实质由许多HTTP头组成

解决办法:

1. 在handler上增加@CrossOrigin

   但若handler太多 , 第一种方法就稍显冗余了.

2. 统一增加一个过滤器

package com.sunsplanter.utils;
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 {
    @Bean
    //返回一个corsFilter过滤器
    //创建过滤器需要一个参数:对象source ,
    // source需要注册一个corsConfiguration
    //corsConfiguration需要声明规则
    public CorsFilter corsFilter(){
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        //*为通配符 , 表示允许所有请求域通过
        corsConfiguration.addAllowedOrigin("*");
        //*为通配符 , 表示允许所有请求头通过
        corsConfiguration.addAllowedHeader("*");
        //*为通配符 , 表示允许所有请求方法通过
        corsConfiguration.addAllowedMethod("*");
        
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**",corsConfiguration);
        return new CorsFilter(source);
    }
}

IoC自动装配 , 无需再次调用 ,该全局规则会自动生效 .