解决跨域问题

解决跨域问题

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

同源策略：是指协议，域名，端口都要相同，其中有一个不同都会产生

非简单请求（PUT、DELETE）等，需要先发送预检请求。

解决跨域问题

1. 使用nginx部署为同一个域的请求
2. 配置当此请求允许跨域（让服务器给预检请求一个响应允许跨域）
   1. 添加响应头
      • Access-Control-Allow-Origin：支持哪些来源的请求跨域
      • Access-Control-Allow-Methods：支持哪些方法跨域
      • Access-Control-Allow-Credentials：跨域请求默认不包含cookie，设置为true可以包含cookie
      • Access-Control-Expos-Headers：跨域请求暴露的字段
      • Access-Control-Max-Age：表明该响应的有效时间，在有效时间内，浏览器无需为同一请求再次发起预检请求。请注意：浏览器自身维护了一个最大有效时间，如果该首部字段的值超过了最大有效时间，将不会生效。

Tips：可以在网关里添加一个Filter，在请求发送到服务器时放行，等待执行完毕返回浏览器之前，在响应里添加如上字段。

解决方案

在网关中添加如下配置类

package com.hang.daxiongmall.gateway.config;

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
public class DaxiongmallCorsConfiguration {

    @Bean
    public CorsWebFilter corsWebFilter() {
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();

        CorsConfiguration corsConfiguration = new CorsConfiguration();

        //1. 配置跨域
        corsConfiguration.addAllowedHeader("*");//任意请求头
        corsConfiguration.addAllowedMethod("*");//任意请求方法
        corsConfiguration.addAllowedOrigin("*");//任意来源
        corsConfiguration.setAllowCredentials(true);//是否允许携带cookie进行跨域

        source.registerCorsConfiguration("/**", corsConfiguration);
        return new CorsWebFilter(source);
    }
}