Java后端设置服务器允许跨域

小鱼儿 2024-04-23 15:47 2阅读 0赞

#### 文章目录 ####

*  1、实现
 *  2、一些问题
 *   *  关于各项请求头的作用
     *  关于预检请求
 *  3、一些补充
 *  4、疑问点

## 1、实现 ##

以下通过servlet的Filter给所有响应的header加了一些跨域相关的数据，以实现允许跨域。

import org.springframework.context.annotation.Configuration;
    import org.springframework.core.Ordered;
    import org.springframework.core.annotation.Order;
    import javax.servlet.*;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    import java.io.IOException;
    
    @Order(Ordered.HIGHEST_PRECEDENCE)
    @Configuration
    public class GlobalCorsFilter implements Filter {
        
    
        @Override
        public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
        
            HttpServletResponse response = (HttpServletResponse) res;
            HttpServletRequest request = (HttpServletRequest) req;
            //允许所有的域访问，可以设置只允许自己的域访问
            //服务器只需要告诉浏览器允许的域
            response.setHeader("Access-Control-Allow-Origin", "*");
            //response.setHeader("Access-Control-Allow-Origin", "http://www.domain1.com");
            //允许所有方式的请求(GET、POST),用于告知浏览器哪些方法是被允许的
            response.setHeader("Access-Control-Allow-Methods", "*");
            //指定了预检请求（OPTIONS请求）的有效期，单位为秒。在有效期内，浏览器可以直接发送实际请求，而无需再次发送预检请求。
            //（如果不设 Chromium 同时规定了一个默认值 5 秒），没有缓存将以OPTIONS进行预请求
            response.setHeader("Access-Control-Max-Age", "3600");
            //允许的头信息，告知浏览器哪些自定义请求头字段是被允许的
            response.setHeader("Access-Control-Allow-Headers", "x-requested-with, authorization");
            //代表是预检请求
            if ("OPTIONS".equalsIgnoreCase(request.getMethod())) {
        
                //直接让预检请求返回200，告诉浏览器可以发送实际请求了
                response.setStatus(HttpServletResponse.SC_OK);
            } else {
        
                //添加完头部信息后，直接放行
                chain.doFilter(req, res);
            }
        }
    }

## 2、一些问题 ##

### 关于各项请求头的作用 ###

![在这里插入图片描述][ce8f7222ca6548a08306ea450531ce77.png]

### 关于预检请求 ###

![在这里插入图片描述][6ea248a17443472e81ef4693081fee7f.png]

简言之就是发送OPTION请求到服务器，服务器根据预检请求的请求头信息，自行判断是否允许跨域，并把判断结果放到响应的header中返回给浏览器。预检请求的请求头中包含了一些关键信息，例如请求方法、请求头字段、请求的URL等。以下是一个预检请求的示例：

请求方法：OPTIONS
    URL：https://www.example.com/api/data
    
    请求头字段：
    Origin: https://www.example.com
    Access-Control-Request-Method: POST
    Access-Control-Request-Headers: Content-Type

这个示例中，浏览器向 https://www.example.com 发送了一个OPTIONS请求，用于检查是否允许发送POST请求，并且是否允许包含Content-Type请求头字段。**预检请求的服务器是当前URL的服务器，而不是跳转页面URL的服务器。预检请求是在发送实际请求之前进行的，用于检查服务器是否允许跨域请求。因此，预检请求会发送到当前URL的服务器，以获取服务器的许可。**

![在这里插入图片描述][ef5e17403a3a4e19accbb4d48c186e55.png]

## 3、一些补充 ##

关于跨域的前端实现或者nginx实现，跳这篇：[【跨域】][Link 1] 。文章部分概念贴图：

![在这里插入图片描述][81a9620d885e4abfb0ced074ae61a7cc.png]

\[截图来源：上面链接\]

## 4、疑问点 ##

我理解的是判断下是否为OPTION请求方式，是则加允许跨域的头部，不懂为啥旧项目给所有的请求都加：

![在这里插入图片描述][d3145d0b91c147fabc0a963ca0941d0c.png]

[ce8f7222ca6548a08306ea450531ce77.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/23/f181367565dd4a87aefab2424a230bc0.png
[6ea248a17443472e81ef4693081fee7f.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/23/8f21f458359848cc92e811495bf032df.png
[ef5e17403a3a4e19accbb4d48c186e55.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/23/ee521a65fbc24d659afe930ae9bced2e.png
[Link 1]: https://blog.csdn.net/qq_38128179/article/details/84956552
[81a9620d885e4abfb0ced074ae61a7cc.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/23/a36a7957ce1647dd95f72397340062fb.png
[d3145d0b91c147fabc0a963ca0941d0c.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/23/251ad60bbc42421083fc7b16aab6801e.png