本文由 简悦 SimpRead 转码， 原文地址 blog.csdn.net
记录一下错误，以博客的形式
前言
跨域（Cross-Origin）是指在 Web 开发中，当一个 Web 应用试图从一个源（域名、协议、端口组合）获取资源时，该请求的目标与当前页面的源不同。具体来说，当一个页面的 JavaScript 代码尝试向不同域名、协议或端口的服务器发送请求时，就会发生跨域请求。
跨域请求是由浏览器实施的同源策略（Same-Origin Policy）限制导致的。同源策略是浏览器的一项安全机制，旨在保护用户的隐私和安全。同源策略要求 Web 页面只能从相同源加载资源，不同源的页面不能访问彼此的数据，以防止恶意网站获取用户的敏感信息。
跨域请求通常发生在以下情况下：
- 不同域名之间的请求： 例如，前端应用部署在
http://example.com，而后端 API 服务部署在http://api.example.com。 - 不同子域之间的请求： 例如，前端应用部署在
http://www.example.com，而后端 API 服务部署在http://api.example.com。 - 不同协议之间的请求： 例如，前端应用部署在
https://example.com，而后端 API 服务部署在http://api.example.com。
什么是 CORS 错误？
CORS 是浏览器实现的一种安全机制，用于控制在客户端脚本中发起的跨源 HTTP 请求。当浏览器发现一个跨域请求时，它会检查请求目标的响应中是否包含特定的 CORS 头部。如果缺少这些头部或者头部中的信息不符合要求，浏览器就会拒绝该请求，并报告 CORS 错误。
为什么会出现 CORS 错误？
CORS 错误通常由以下原因导致：
- 缺少或不正确的 CORS 响应头部： 服务器未正确配置 CORS 响应头部，导致浏览器拒绝跨域请求。
- 浏览器同源策略： 浏览器的同源策略限制了在不同源（域名、协议、端口）之间的数据交换，跨域请求需要特殊的权限设置。
如何解决 CORS 错误？
要解决 CORS 错误，需要在服务器端进行配置。以下是常见的解决方法：
- 在服务器端设置正确的 CORS 响应头部：
- 允许特定域名访问资源：设置
Access-Control-Allow-Origin头部。 - 允许特定 HTTP 方法：设置
Access-Control-Allow-Methods头部。 - 允许特定 HTTP 头部：设置
Access-Control-Allow-Headers头部。 - 允许发送 Cookie：设置
Access-Control-Allow-Credentials头部。 - 允许客户端访问自定义响应头部：设置
Access-Control-Expose-Headers头部。
- 允许特定域名访问资源：设置
- 使用 Spring Boot 等后端框架提供的 CORS 配置功能：
- 在 Spring Boot 中，可以通过添加配置类或者拦截器来实现 CORS 配置，具体方法请参考官方文档或者相关教程。
Spring Boot 提供了方便的 CORS 配置功能，通过添加配置类或者拦截器来实现 CORS 配置，以允许跨域请求。
首先，创建一个名为CorsConfig的 Java 类，用于配置 CORS。这个类需要实现WebMvcConfigurer接口，并重写addCorsMappings方法。
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 配置。