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、一些问题
关于各项哀求头的作用
关于预检哀求
简言之就是发送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的服务器,以获取服务器的许可。
3、一些增补
关于跨域的前端实现或者nginx实现,跳这篇:【跨域】 。文章部分概念贴图:
[截图泉源:上面链接]
4、疑问点
我明白的是判断下是否为OPTION哀求方式,是则加答应跨域的头部,不懂为啥旧项目给全部的哀求都加:
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。 |