SpringCloud-Gateway解决跨域问题

一、跨域问题介绍

跨域：域名不一致就是跨域。

跨域的类型：

• 域名不同: 比如：www.damon-liu.cn 和 www.damon-liu.work

• 域名相同，端口不同：localhost:8080 和 localhost8081

跨域问题：浏览器禁止请求的发起者与服务端发生跨域ajax请求，请求被浏览器拦截的问题。

解决方案：CORS

CORS（跨域资源共享）是一种用于在Web浏览器和服务器之间进行跨域 HTTP 请求的机制。在 Web 开发中，浏览器的同源策略（Same-Origin Policy）限制了从一个源加载的文档或脚本如何与来自另一个源的资源进行交互。CORS 允许服务器指定哪些源（域）有权访问其资源，以及哪些HTTP方法（例如GET、POST）和头信息是允许的。

通过在 HTTP 响应头中添加 CORS 相关的头信息，如 `Access-Control-Allow-Origin`，服务器可以告知浏览器哪些源是被允许的。这允许跨域的 Ajax 请求和其他跨域资源请求变得安全可行，同时仍然受到一定的限制，确保了 Web 应用的安全性。CORS 是现代 Web 应用中解决跨域请求问题的一种标准化方式。

网关处理跨域采用的同样是 CORS 方案，并且只需要简单配置即可实现。

二、解决跨域问题的方法

1、创建全局过滤器

在 Spring Cloud 中解决跨域问题可以通过配置路由来实现。你可以使用 CorsGlobalFilter 来配置全局的跨域支持。以下是一个简单的示例：

首先，在你的 Spring Cloud Gateway 项目中，创建一个全局过滤器类，用于配置跨域支持。例如，你可以创建一个名为 CorsFilter 的类：

import org.springframework.cloud.gateway.filter.GlobalFilter;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.core.Ordered;
import org.springframework.core.annotation.Order;
import org.springframework.web.server.ServerWebExchange;
import reactor.core.publisher.Mono;
 
@Configuration
public class CorsFilter {
 
    @Bean
    @Order(Ordered.HIGHEST_PRECEDENCE)
    public GlobalFilter corsFilter() {
        return (exchange, chain) -> {
            ServerWebExchange.Builder webExchangeBuilder = exchange.mutate();
            webExchangeBuilder
                    .request(exchange.getRequest())
                    .response(exchange.getResponse());
 
            webExchangeBuilder
                    .response(exchange.getResponse()
                            .mutate()
                            .header("Access-Control-Allow-Origin", "*")
                            .header("Access-Control-Allow-Methods", "GET, PUT, POST, DELETE, OPTIONS")
                            .header("Access-Control-Allow-Headers", "Content-Type")
                            .build());
 
            return chain.filter(webExchangeBuilder.build());
        };
    }
}

这个过滤器会添加一些常用的跨域头信息，比如 Access-Control-Allow-Origin，Access-Control-Allow-Methods，和 Access-Control-Allow-Headers。你可以根据你的需求进行修改。

2、编辑Gateway设置

然后，在 gateway 服务的 application.yml 文件中，添加下面的配置，确保允许 OPTIONS 请求，因为浏览器在进行跨域请求时可能会先发一个 OPTIONS 请求以验证是否允许跨域：

spring:
    cloud:
        gateway:
          # 
          globalcors: # 全局的跨域处理
            add-to-simple-url-handler-mapping: true # 解决options请求被拦截问题
            corsConfigurations:
              '[/**]':
                allowedOrigins: # 允许哪些网站的跨域请求 
                  - "http://localhost:8090"
                  - "http://localhost:8081"
                allowedMethods: # 允许的跨域ajax的请求方式
                  - "GET"
                  - "POST"
                  - "DELETE"
                  - "PUT"
                  - "OPTIONS"
                allowedHeaders: "*" # 允许在请求中携带的头信息
                allowCredentials: true # 是否允许携带cookie
                maxAge: 360000 # 这次跨域检测的有效期

以上是一个简单的配置，我们根据实际需求进行具体调整。添加 Gateway 的配置之后，Spring Cloud Gateway 就可以处理跨域请求了。

三、Gateway解决跨域总结

Spring Cloud Gateway作为微服务架构中的关键组件，通过提供灵活的路由和过滤器机制，有效地解决了分布式系统中的跨域问题。在构建可扩展的分布式系统时，跨域资源共享（CORS）是一个常见而又具有挑战性的问题，而Spring Cloud Gateway为开发人员提供了一种简洁而强大的方式来处理这一问题。

要解决跨域问题，首先需要在Spring Cloud Gateway的配置文件中添加相关的跨域配置。这包括指定允许访问的域，配置允许的HTTP方法，以及其他必要的头信息。通过这些配置，开发人员能够明确规定系统中允许进行跨域请求的条件，确保通信的可控性和安全性。

总体而言，Spring Cloud Gateway通过其强大的路由和过滤器机制，以及灵活的跨域配置，为开发人员提供了构建高效、安全和可维护的微服务系统的利器。通过合理利用这些功能，开发人员能够更加轻松地应对分布式系统中的跨域问题，提升系统的整体质量和性能。因此，Spring Cloud Gateway成为了现代微服务架构中不可或缺的一部分。