当前位置：首页 > article >正文

解决后端跨域问题

article 2025/2/27 3:04:28

一、什么是跨域问题？

1、跨域问题的定义

2、举例

3、为什么会有跨域问题的存在？

二、解决跨域问题

1、新建配置类

2、编写代码

三、结语

一、什么是跨域问题？

1、跨域问题的定义

跨域问题（Cross-Origin Resource Sharing, CORS）是 Web 开发中常见的安全机制问题，主要发生在浏览器中。当浏览器从一个域名的网页向另一个域名的服务器发起请求时，如果这两个域名不同（协议、域名或端口不同），浏览器会阻止这种请求，这就是跨域问题。

2、举例

跨域是指浏览器从一个 源（Origin） 向另一个源发起请求时，如果这两个源不同，就称为跨域。源由以下三部分组成：

协议（如 http 或 https）
域名（如 example.com）
端口（如 8080）

如果协议、域名或端口中任意一个不同，就属于跨域。例如：

http://example.com 和 https://example.com（协议不同）
http://example.com 和 http://api.example.com（域名不同）
http://example.com 和 http://example.com:8080（端口不同）

3、为什么会有跨域问题的存在？

跨域问题是浏览器的安全机制，称为 同源策略（Same-Origin Policy）。它的目的是防止恶意网站通过脚本访问其他网站的资源，保护用户数据安全。

二、解决跨域问题

1、新建配置类

2、编写代码

@Configuration//表示这是一个配置类，Spring 容器会在启动时加载该类，并将其中的配置应用到整个应用程序中。
public class WebConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")///** 表示所有路径都适用该 CORS 规则。你可以根据需要修改为特定的路径，例如 /api/**。
                .allowedOrigins("*")//表示允许所有来源（域）访问后端资源。* 是一个通配符，表示允许任何域访问。如果你只想允许特定域访问，可以将 * 替换为具体的域名，例如 "http://example.com"。
                .allowedMethods("GET","POST","PUT","DELETE")//指定允许的 HTTP 方法。这里配置了 GET、POST、PUT 和 DELETE 方法。如果需要支持其他方法（如 PATCH、OPTIONS），可以添加到列表中。
                .allowedHeaders("*");//allowedHeaders("*") 表示允许所有请求头。如果你只想允许特定请求头，可以将 * 替换为具体的头信息，例如 "Content-Type", "Authorization"。
    }
}