最近在做一个系统遇到一个问题,在网上找个一个和我遇到相同问题的(原文地址:https://www.cnblogs.com/helloyy/p/6109665.html)按照他的步骤还是没有解决,继续查找资料,根据他的方法做出修改,最后解决。(不想写字就自己拿过来了。。)

应用场景:

  项目测试环境:前端应用HTML,js,jQuery ajax请求,部署在Apache服务器;后端业务系统应用spring mvc,mybatis,部署在tomcat服务器。当在一个系统需要调用另一个系统的时候,就会出现跨域的问题,即本次我们遇到了ajax请求的跨域问题。

  系统权限安全框架使用shiro,系统登录时发送ajax请求调用springmvc action方法进行系统登录及身份认证,角色权限授权等。由于ajax请求时,浏览器会认为携带Cookie是不安全请求,将限制其携带Cookie信息,导致登录action方法无法获取并响应相应的Cookie(JSESSIONID),身份认证及角色权限授权、退出等都操作都无法正常使用。

解决方案:

  1、当发送ajax请求时,查看浏览器调试信息中Headers和Cookies,发现发送到后端的跨域请求并没有携带 cookie 信息,可见Request Headers不包含Cookie属性,Response Headers中也不包含Set-Cookie属性,导致无法得到后台业务系统的认证。

 

  解决:在ajax里添加withCredentials的配置,允许其请求携带cookie信息。通过设置withCredentials=true,发送Ajax时,Request header中便会带上 Cookie 信息。

$.ajax({
type: "post",
url:url,
async:false,
data:datatosend,
dataType:"json",
beforeSend: function(xhr) {
xhr.withCredentials = true;
}
crossDomain:true,
success: function (data) {
var a=JSON.stringify(data);
if(data.result==true){
  ...........
   }else{
       ...........
     }
},
error:function (data) {
var a=JSON.stringify(data);
alert(a);
}
});

注意:<踩过的坑>我们在beforeSend方法里设置withCredentials=true;在上述代码情境下,如果使用xhrFields:{ withCredentials:true }方法,则允许携带cookie信息的配置并不生效。(原因:ajax中添加了async:false,即修改为同步了,在窗口上下文的同步模式中,已不再支持使用XMLHttpRequest的withCredentials属性)。当保持异步模式时,我们可以更换对应的方法。注意2种方法的区分。

  2、服务器server端要配置Access-Control-Allow-Credentials

  我们在客户端设置了withCredentials=true 参数,对应着,服务器端要通过在响应 header 中设置Access-Control-Allow-Credentials = true来运行客户端携带证书式的访问。通过对Credentials参数的设置,就可以保持跨域Ajax时传递的Cookie。

response.setHeader("Access-Control-Allow-Credentials", "true");

  3、服务器server端要配置Access-Control-Allow-Origin

  到以上配置为止,发送ajax请求,我们发现还会出现一个错误,提示我们 Access-Control-Allow-Origin 不能用 * 通配符。原因是:当服务器端 Access-Control-Allow-Credentials = true时,参数Access-Control-Allow-Origin 的值不能为 '*' 。

  我们重新设置Access-Control-Allow-Origin的值,当服务器端接收到请求后,在返回响应时,把请求的域Origin填写到响应的Header信息里(即谁访问我,我允许谁),代码如下:

response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin"));

  ok,到目前问题搞定了,经过测试,可成功传递及响应cookie信息,浏览器调试信息如下图所示:

  

  

  

  

  他的是解决了,但是我的还是不行。最后做如下修改,完美解决。

1,前端请求

        $.ajax({
type: "post",
cache: false, //是否缓存
async:false, //同步
url:"http://xxxxxxxxx",
xhrFields: {withCredentials: true},
crossDomain:true, //允许跨域
success:function (data) {
alert(data.code);
}
});

2,服务端配置

        response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin"));
response.setHeader("Access-Control-Allow-Methods", "GET,POST,OPTIONS");
response.setHeader("Access-Control-Max-Age", "3600");
response.setHeader("Access-Control-Allow-Credentials", "true");
response.setHeader("Access-Control-Allow-Headers", "x-requested-with");

Ajax跨域请求,无法传递及接收cookie信息的更多相关文章

  1. Ajax跨域请求,无法传递及接收cookie信息解决方案

    最近的项目中涉及到了应用ajax请求后台系统登录,身份认证失败,经过不断的调试终于找到解决方案. 应用场景: 项目测试环境:前端应用HTML,js,jQuery ajax请求,部署在Apache服务器 ...

  2. ajax 跨域请求没有带上cookie 解决办法

    公司项目前后端分离.. 前端全部html 静态页面.. 后端java 接口服务 由于前后端分离,出现跨域问题. 为了解决,我们使用jsonp 方式请求接口服务,暂时解决了跨域问题(使用jquery a ...

  3. Ajax跨域请求action方法,无法传递及接收cookie信息(应用于系统登录认证及退出)解决方案

    最近的项目中涉及到了应用ajax请求后台系统登录,身份认证失败,经过不断的调试终于找到解决方案. 应用场景: 项目测试环境:前端应用HTML,js,jQuery ajax请求,部署在Apache服务器 ...

  4. Ajax跨域请求附带Cookie/Ajax跨域请求附带身份凭证

    一.跨域请求中默认不带cookie等验证凭证 尤其对于post请求. 对于ajax请求,其中post,get都可以正常访问. withCredentials: false, // 允许携带cookie ...

  5. 有关Ajax跨域请求的解决方案

    前言 最近博主在赶项目进度.所以微信二次开发那边的博文一直没有更新.后续时间会慢慢记录这个学习历程的.来年公司要开发微信小程序.到时也会记录一下历程. 闲话少说,今天在工作中遇到了SpringMVC接 ...

  6. JAVAEE——宜立方商城11:sso登录注册功能实现、通过token获得用户信息、Ajax跨域请求(jsonp)

    1. 学习计划 第十一天: 1.sso注册功能实现 2.sso登录功能实现 3.通过token获得用户信息 4.Ajax跨域请求(jsonp) 2. Sso系统工程搭建 需要创建一个sso服务工程,可 ...

  7. Laravel中的ajax跨域请求

    最近接触Laravel框架ajax跨域请求的过程中遇到一些问题,在这里做下总结. 一开始发起ajax请求一直报500错误,搜索相关资料后发现Laravel要允许跨域请求可以加入Cors中间件,代码如下 ...

  8. 解决ajax跨域请求 (总结)

    ajax跨域请求,目前已用几种方法实现:   1)用原生js的xhr对象实现.                var url="http://freegeoip.net/json/" ...

  9. JQuery的Ajax跨域请求原理概述及实例

    今天在项目中需要做远程数据加载并渲染页面,直到开发阶段才意识到ajax跨域请求的问题,隐约记得Jquery有提过一个ajax跨域请求的解决方式,于是即刻翻出Jquery的API出来研究,发 JQuer ...

随机推荐

  1. 我的第三个开源库GuaJiangViewDemo——中文文档

    GuaJiangViewDemo 欢迎Star 一个可以简单的刮刮奖View的封装 测试图 使用 1.在根目录上添加 maven { url 'https://jitpack.io' } 2.添加依赖 ...

  2. Java基础篇——线程、并发编程知识点全面介绍(面试、学习的必备索引)

    原创不易,如需转载,请注明出处https://www.cnblogs.com/baixianlong/p/10739579.html,希望大家多多支持!!! 一.线程基础 1.线程与进程 线程是指进程 ...

  3. 浅析 JavaScript 中的 函数 uncurrying 反柯里化

    柯里化 柯里化又称部分求值,其含义是给函数分步传递参数,每次传递参数后部分应用参数,并返回一个更具体的函数接受剩下的参数,这中间可嵌套多层这样的接受部分参数函数,直至返回最后结果. 因此柯里化的过程是 ...

  4. Android WebView的HTML中的select标签不起作用

    Android WebView的HTML中的select标签不起作用 经过查询资料,了解到android对html里的select标签是弹出一个原生的选择器. 问题: Webview中的select没 ...

  5. 使用ethtool显示硬件PHY信息

    1.总结: 使用ethtool 可以查看端口的phy配置 2.显示端口配置 [root@localhost zhou]# ethtool ens33Settings for ens33: Suppor ...

  6. (详细)华为畅享7 SLA-AL00的usb调试模式在哪里打开的流程

    就在我们使用Pc链上安卓手机的时候,如果手机没有开启usb开发者调试模式,Pc则不能够成功检测到我们的手机,有时我们使用的一些功能比较好的的应用软件如之前我们使用的一个应用软件引号精灵,老版本就需要打 ...

  7. Vysor破解助手for Linux and macOS

    <Vysor Pro破解助手>提供了Windows下的Vysor破解工具,为了使用Linux及macOS同学的方便,最近整理了Linux及macOS版的Vysor破解助手. Linux版V ...

  8. Android .9.png 的介绍

    概述 .9.PNG是安卓开发里面的一种特殊的图片,这种格式的图片通过ADT自带的编辑工具生成,使用九宫格切分的方法.点九图是一种可拉伸的位图,android会自动调整它的大小,来使图像在充当背景时可以 ...

  9. 导致spring事务配置不起作用的一种原因

    @Component public class AnalyticsApplication { @Autowired private InitializationActionService initia ...

  10. C#学习笔记---C#操作SQL数据库

    C#操作SQL数据库 Connection(连接)对象 连接字符串: 形式1.”server=;uid=;pwd=;database=” 形式2.”server=;Intergrated Securi ...