跨域问题处理（学习笔记，不喜勿喷）

一、了解跨域

什么是跨域？

• 跨域是指浏览器不能执行其他网站的脚本，它是由浏览器的同源策略造成的，是浏览器对javascript施加的安全限制

同源策略？

• 是指协议、域名、端口都要相同，但凡其中一项不相同，都会产生跨域

浏览器会将cors请求分成两类：简单请求，非简单请求

简单请求：

（1) 请求方法是以下三种方法之一：

• HEAD
• GET
• POST

（2）HTTP的头信息不超出以下几种字段：

• Accept
• Accept-Language
• Content-Language
• Last-Event-ID
• Content-Type：只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain

非简单请求：

（1）请求方法是以下方法之一

• PUT
• DELETE
• CONNECT 
• OPTIONS
• TRACE
• PATCH

  (2)

• Content-Type字段的类型是application/json

对于非简单请求，浏览器在发送请求之前，会发送预前请求OPTIONS  

本次操作发送了两次请求，第一次为于预前请求，用于判断当前网页是否在服务器的许可名单中，本例中请求未被许可于是发送失败

 

二、解决跨域问题

 

 

     处理跨域问题主要针对响应头进行处理

• Access-Control-Allow-Methods :支持哪些跨域方法
• Access-Control-Allow-Origin :支持哪些来源的请求跨域
• Access-Control-Expose-Headers:跨域请求暴露的字段
• Access-Control-Allow-Credentials:跨域请求默认不包含cookie，设置成true可以包含cookie
• Access-Control-Max-Age:表明相应的有效期多长时间，在有效期内，再次发送请求无需发送预前请求

处理方法

1）通过CorsWebFilter对象进行处理，只需要将它进行配置然后放入spring容器中就可以起作用

创建一个config类，作为配置文件，切记要添加的两个注解

@Configuration  将类注册为bean容器

@Bean    将方法注入bean中

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.reactive.CorsWebFilter;
import org.springframework.web.cors.reactive.UrlBasedCorsConfigurationSource;


/**
 * 处理跨域请求的configuration   //注意注解！！！reactive包下的
 */
@Configuration
public class CorsConfigurationS {
    //只需要把跨域处理方法放进容器中，就会自动产生作用
    @Bean
    public CorsWebFilter corsWebFilter() {
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();

        CorsConfiguration corsConfiguration = new CorsConfiguration();
        // 配置跨越允许任意请求头
        corsConfiguration.addAllowedHeader("*");
        // 允许任意方法
        corsConfiguration.addAllowedMethod("*");
        //单独设置允许方法
       corsConfiguration.addAllowedMethod("OPTIONS");
       corsConfiguration.addAllowedMethod("HEAD");
        corsConfiguration.addAllowedMethod("GET");
       corsConfiguration.addAllowedMethod("PUT");
        corsConfiguration.addAllowedMethod("POST");
       corsConfiguration.addAllowedMethod("DELETE");
       corsConfiguration.addAllowedMethod("PATCH");

        // 允许指定
        corsConfiguration.addAllowedOrigin("http://localhost:8001");
        // 允许任意请求来源
        corsConfiguration.addAllowedOrigin("*");
        // 允许携带cookie
        corsConfiguration.setAllowCredentials(true);


        source.registerCorsConfiguration("/**", corsConfiguration);

        return new CorsWebFilter(source);
    }

}

2）通过注解@CrossOrigin()快捷完成即可完成跨域，如果不进行配置则表示完全允许跨域，该方法相对来说较为简单，但是只能针对单个控制器，不能实现全局跨域处理