解决CORS错误(Spring Boot)

记录一下错误,以博客的形式

前言

跨域(Cross-Origin)是指在Web开发中,当一个Web应用试图从一个源(域名、协议、端口组合)获取资源时,该请求的目标与当前页面的源不同。具体来说,当一个页面的JavaScript代码尝试向不同域名、协议或端口的服务器发送请求时,就会发生跨域请求。

跨域请求是由浏览器实施的同源策略(Same-Origin Policy)限制导致的。同源策略是浏览器的一项安全机制,旨在保护用户的隐私和安全。同源策略要求Web页面只能从相同源加载资源,不同源的页面不能访问彼此的数据,以防止恶意网站获取用户的敏感信息。

跨域请求通常发生在以下情况下:

  1. 不同域名之间的请求: 例如,前端应用部署在http://example.com,而后端API服务部署在http://api.example.com
  2. 不同子域之间的请求: 例如,前端应用部署在http://www.example.com,而后端API服务部署在http://api.example.com
  3. 不同协议之间的请求: 例如,前端应用部署在https://example.com,而后端API服务部署在http://api.example.com

什么是CORS错误?

CORS是浏览器实现的一种安全机制,用于控制在客户端脚本中发起的跨源HTTP请求。当浏览器发现一个跨域请求时,它会检查请求目标的响应中是否包含特定的CORS头部。如果缺少这些头部或者头部中的信息不符合要求,浏览器就会拒绝该请求,并报告CORS错误。

为什么会出现CORS错误?

CORS错误通常由以下原因导致:

  1. 缺少或不正确的CORS响应头部: 服务器未正确配置CORS响应头部,导致浏览器拒绝跨域请求。
  2. 浏览器同源策略: 浏览器的同源策略限制了在不同源(域名、协议、端口)之间的数据交换,跨域请求需要特殊的权限设置。

如何解决CORS错误?

要解决CORS错误,需要在服务器端进行配置。以下是常见的解决方法:

  1. 在服务器端设置正确的CORS响应头部:
    • 允许特定域名访问资源:设置Access-Control-Allow-Origin头部。
    • 允许特定HTTP方法:设置Access-Control-Allow-Methods头部。
    • 允许特定HTTP头部:设置Access-Control-Allow-Headers头部。
    • 允许发送Cookie:设置Access-Control-Allow-Credentials头部。
    • 允许客户端访问自定义响应头部:设置Access-Control-Expose-Headers头部。
  2. 使用Spring Boot等后端框架提供的CORS配置功能:
    • 在Spring Boot中,可以通过添加配置类或者拦截器来实现CORS配置,具体方法请参考官方文档或者相关教程。

Spring Boot提供了方便的CORS配置功能,通过添加配置类或者拦截器来实现CORS配置,以允许跨域请求。


首先,创建一个名为CorsConfig的Java类,用于配置CORS。这个类需要实现WebMvcConfigurer接口,并重写addCorsMappings方法。

java 复制代码
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

@Configuration
public class CorsConfig implements WebMvcConfigurer {

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("http://localhost") // 允许来自http://localhost的请求
                .allowedMethods("GET", "POST", "PUT", "DELETE") // 允许的HTTP方法
                .allowedHeaders("*"); // 允许的HTTP头部
    }
}

复制这段代码即可解决问题

在这个配置类中,通过allowedOrigins方法指定允许访问资源的域名,可以是单个域名、多个域名,或者使用通配符*表示允许任意域名访问。通过allowedMethods方法指定允许的HTTP方法,以及通过allowedHeaders方法指定允许的HTTP头部。你可以根据自己的需求进行修改。

这样配置完成后,当前端应用通过http://localhost访问后端服务时,就不会再出现CORS错误了。后端服务会正确地响应跨域请求,提供资源访问权限。

请确保这个CorsConfig类能够被Spring Boot扫描到,通常放置在与启动类(如Application类)相同的包或其子包下。这样Spring Boot启动时就会加载这个配置类,并应用其中的CORS配置。

相关推荐
苹果醋324 分钟前
React源码02 - 基础知识 React API 一览
java·运维·spring boot·mysql·nginx
Hello.Reader43 分钟前
深入解析 Apache APISIX
java·apache
盛派网络小助手1 小时前
微信 SDK 更新 Sample,NCF 文档和模板更新,更多更新日志,欢迎解锁
开发语言·人工智能·后端·架构·c#
菠萝蚊鸭1 小时前
Dhatim FastExcel 读写 Excel 文件
java·excel·fastexcel
旭东怪1 小时前
EasyPoi 使用$fe:模板语法生成Word动态行
java·前端·word
007php0071 小时前
Go语言zero项目部署后启动失败问题分析与解决
java·服务器·网络·python·golang·php·ai编程
∝请叫*我简单先生1 小时前
java如何使用poi-tl在word模板里渲染多张图片
java·后端·poi-tl
ssr——ssss2 小时前
SSM-期末项目 - 基于SSM的宠物信息管理系统
java·ssm
一棵星2 小时前
Java模拟Mqtt客户端连接Mqtt Broker
java·开发语言
鲤籽鲲2 小时前
C# Random 随机数 全面解析
android·java·c#