首页 > 其他分享> 文章详细

SpringCloudGateway解决跨域问题

2022-05-18 16:35:08 阅读：299 来源： 互联网

标签：浏览器跨域 SpringCloudGateway ajax 解决允许 config 请求

1.跨域问题详情

2.为什么会跨域?

官方定义：https://developer.mozilla.org/zh-CN/docs/Web/HTTP/CORS

怎么出现的？

1、浏览器访问了一个业务 http://192.168.200.130/#/baseinfo/prop/list
2、这个页面上有个ajax，要发给一个位置：http://192.168.200.1/admin/product/getCategory1
3、ajax想要请求的服务器位置和浏览器所在的当前页面位置，有一处不一样就会被CORS限制

协议名://主机地址:端口号/访问路径?查询字符串

协议名://主机地址:端口号有一个不一样就算跨域

因此：跨域问题是针对ajax的一种限制。

3.因为我使用了Gateway,所以说一下使用Gateway解决跨域问题

(1)浏览器会将ajax请求分为两类，其处理方案略有差异：简单请求、复杂请求。

简单请求

- 只要同时满足以下两大条件，就属于简单请求。：

- （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`:纯文本

当浏览器发现发现的ajax请求是简单请求时，会在请求头中携带一个字段：Origin
Origin中会指出当前请求属于哪个域（协议+域名+端口）。服务会根据这个值决定是否允许其跨域。

一句话:

浏览器基于“同源策略”安全限制，ajax请求的源的地址，必须和浏览器当前所在的地址一样（协议名://主机地址:端口号）。
违反同源策略的所有ajax请求，请求发出去，但是服务器没有同意，浏览器不会把这次ajax的处理结果交给代码。
请求发一次:直接发真实请求

复杂请求

只要不是简单请求，就算复杂跨域

请求发两次

预检请求：options。只要预检通过，
真实请求：

(2)如果服务器允许跨域，需要在返回的响应头中携带下面信息：

Access-Control-Allow-Origin: http://qbb.it.com
Access-Control-Allow-Credentials: true
Content-Type: text/html; charset=utf-8
Access-Control-Allow-Origin：可接受的域，是一个具体域名或者*，代表任意
Access-Control-Allow-Credentials：是否允许携带cookie，默认情况下，cors不会携带cookie，除非这个值是true
注意：
- 如果跨域请求要想操作cookie，需要满足3个条件：
- 服务的响应头中需要携带Access-Control-Allow-Credentials并且为true。
- 浏览器发起ajax需要指定withCredentials 为true
- 响应头中的Access-Control-Allow-Origin一定不能为*，必须是指定的域名

4.解决方案

服务器允许跨域即可所以gateway网关配置如下:

yml配置文件方式

spring:
  cloud:
    gateway:
      globalcors:
        cors-configurations:
          '[/**]':
            allowedOrigins: "*"  #允许所有ip跨域访问
            allowedMethods: "*"  #允许所有请求方式
            allowedHeaders: "*"  #允许任何头进行跨域
            allowCredentials: true #允许携带cookie
            ## 以上配完成，简单跨域复杂跨域都允许。

Java配置类方式

package com.qbb.qmall.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;

/**
 * @author QiuQiu&LL (个人博客:https://www.cnblogs.com/qbbit)
 * @version 1.0
 * @date 2022-05-18  16:01
 * @Description:
 */
@Configuration
public class CorsConfig {
    @Bean
    public CorsWebFilter corsFilter() {
        CorsConfiguration config = new CorsConfiguration();
        config.setAllowCredentials(true); // 是否允许携带cookie
        config.addAllowedOrigin("*"); // 可接受的域，是一个具体域名或者*（代表任意域名）
        config.addAllowedHeader("*"); // 允许携带的头
        config.addAllowedMethod("*"); // 允许访问的方式

        // 基于Url的跨域配置
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        // 针对所有的请求Url,采用上面的Config配置
        source.registerCorsConfiguration("/**", config);

        return new CorsWebFilter(source);
    }
}

标签：浏览器,跨域,SpringCloudGateway,ajax,解决,允许,config,请求
来源： https://www.cnblogs.com/qbbit/p/16285141.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9