昨天的项目碰到个比较棘手的问题。前端发送ajax请求时,总会在真实请求前多一次请求方法为OPTIONS的请求,而且该请求返回403,导致真实请求失败。后来查阅资料,大致了解了产生该问题的原因及原理,即跨域预检。本文只给出解决方法,不再详述原理,详细可见简单跨域请求和带预检的跨域请求
解决方法也是比较简单,主要是开启后台的options的验证即可。作者使用spirngboot的项目,主要通过拦截器拦截当前的options请求,开启options验证。
public class CorsInterceptor implements HandlerInterceptor {
private static final String OPTIONS = "OPTIONS";
@Override
public boolean preHandle(HttpServletRequest request, HttpServletResponse response,
Object handler) {
//跨域预检
if (OPTIONS.equals(request.getMethod())) {
response.addHeader("Access-Control-Allow-Origin", "*");
response.addHeader("Access-Control-Allow-Methods", "*");
response.addHeader("Access-Control-Allow-Headers", "*");
// 有效期,在24小时内,该请求无需再发送预检请求
response.addHeader("Access-Control-Max-Age", String.valueOf(24 * 60 * 60));
}
return true;
}
}
springboot添加拦截器
@Configuration
public class GlobalConfiguration implements WebMvcConfigurer {
@Override
public void addInterceptors(InterceptorRegistry registry) {
registry.addInterceptor(new CorsInterceptor()).addPathPatterns("/**");
}
}
以上,即可完成因为跨域预检导致的请求失败的问题。
网友评论