jQuery-跨域问题的处理

寻技术 JQuery 2023年07月11日 128

调用登录接口时,后端一般会在调用登录接口成功后,在response中设置cookie,之后前端的每次请求都会自动地在请求头上加上后端设置好的cookie,这对前端来说是透明的。

当登录接口与登录后调用的接口域名不同时,会出现跨域问题。处理跨域问题的方式如下:

前端部分:

 <script>
     $(function () {
         $.ajaxSetup({crossDomain: true, xhrFields: {withCredentials: true}});
     });
 </script>

或是直接在请求中加上crossDomain:true和xhrFields

 $.ajax({
     type: 'POST',
     url: base + "/farmer/farmeruser/login",
     data: pack(data),
     contentType: 'application/json',
     xhrFields: {
         withCredentials: true
     },
     crossDomain: true,
     success: function (data) {
         
     },
     error: function () {
 
     }
 })

后端部分(Java):

 private boolean recharge(HttpServletRequest request, HttpServletResponse response) throws Exception {
     String url = request.getHeader("Origin");
     logger.debug("Access-Control-Allow-Origin:" + url);
     if (!StringUtils.isEmpty(url)) {
         String val = response.getHeader("Access-Control-Allow-Origin");
         if (StringUtils.isEmpty(val)) {
             response.addHeader("Access-Control-Allow-Origin", url);
             response.addHeader("Access-Control-Allow-Credentials", "true");
         }
     }
     return true;
 }

首先获取Allow-Origin的值,然后判断是否为空,若为空,则给resoponse加上Allow-Orgin的值,即为请求处的url,同时设置Allow-Credentials(允许证件)的值为true即可。

这样设置cookie便可以成功,之后的请求都会自动加上cookie。

关闭

用微信“扫一扫”