前后端分离跨域问题解决办法

最新推荐文章于 2025-05-13 23:58:56 发布

大鵬

最新推荐文章于 2025-05-13 23:58:56 发布

阅读量162

点赞数

分类专栏： java 遇见的问题及解决方案文章标签： servlet java

本文链接：https://blog.youkuaiyun.com/weixin_46047612/article/details/123155306

版权

java 同时被 2 个专栏收录

38 篇文章

订阅专栏

遇见的问题及解决方案

26 篇文章

订阅专栏

跨域是指在不同域名或端口下的资源请求，如127.0.0.1:80与127.0.0.1:8888或127.0.0.1:80与www.baidu.com。解决跨域问题可以使用@CrossOrigin注解或配置CORSFilter和CrossConfig，允许特定的Origin、Methods、Headers并处理预检请求。在分布式环境中，SpringCloudGateway可全局配置跨域策略。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

什么是跨域

请求同域资源：

在域名（或 ip 地址）相同，端口号相同下的请求资源，可以看做是同域资源

请求跨域资源：

请求的资源只要是域名（或 ip 地址）、端口号中任意一个不同的资源都可以认为是跨域资源

如：

端口号不同

127.0.0.1:80 与 127.0.0.1:8888 属于跨域

域名 (或 ip 地址) 不同

127.0.0.1:80 与 www.baidu.com 属于跨域

解决方法

方法一

在每个 controller 上面加上注解

@CrossOrigin

方法二：

添加配置文件 CORSFilter、CrossConfig

CORSFilter

package com.hkp.config;

import org.springframework.stereotype.Component;
import javax.servlet.*;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

@Component
public class CORSFilter implements Filter {

	@Override
    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain chain) throws IOException, ServletException {
        HttpServletResponse response = (HttpServletResponse) servletResponse;
        HttpServletRequest request = (HttpServletRequest) servletRequest;
        // 允许哪些Origin发起跨域请求
        String orgin = request.getHeader("Origin");
        // response.setHeader( "Access-Control-Allow-Origin", config.getInitParameter( "AccessControlAllowOrigin" ) );
        response.setHeader( "Access-Control-Allow-Origin", orgin );
        // 允许请求的方法
        response.setHeader( "Access-Control-Allow-Methods", "POST,GET,OPTIONS,DELETE,PUT" );
        //多少秒内,不需要再发送预检验请求，可以缓存该结果
        response.setHeader( "Access-Control-Max-Age", "3600" );
        // 表明它允许跨域请求包含xxx头
        response.setHeader( "Access-Control-Allow-Headers", "x-auth-token,Origin,Access-Token,X-Requested-With,Content-Type, Accept" );
        //是否允许浏览器携带用户身份信息（cookie）
        response.setHeader( "Access-Control-Allow-Credentials", "true" );
        //prefight请求
        if (request.getMethod().equals( "OPTIONS" )) {
            response.setStatus( 200 );
            return;
        }
        chain.doFilter( servletRequest, response );
    }
}

CrossConfig

package com.hkp.config;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;
@Configuration
public class CrossConfig extends WebMvcConfigurerAdapter{
	public void addCorsMappings(CorsRegistry registry){
		registry.addMapping("/**").allowedMethods("*");
	}
}

分布式中网关处理跨域的配置

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