Ajax跨域调接口并用写入Cookie,单点登陆最简单实现

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/lanix516/article/details/82686820

目前有两个域名, www.a.com ,www.b.com,要通过cookie存储用户信息,实现单点登陆, 在进入a,b网站后,首先判断当前cookie中有没有user信息, 如果有user信息,则表明当前用户已经登陆过, 如果没有cookie信息,前端调用登陆接口并将返回的用户信息记录在cookie中。目前,登陆喝认证过程已经分别在a,b网站实现,现在想实现从a站登陆后,同时在b站也写入cookie。

思路:在a站的登陆ajax请求成功后, 请求一个b域名下的api接口,并将登陆信息作为参数发送过去,在接口调用的后台处理程序中,写入cookie,这样b域下即可读到用户的登陆信息。

思路是这样,实现过程中有三点注意:

1.ajax请求添加 {withCredentials:true}

一方面,通过设置 withCredentials, 可以使得跨域ajax请求中协带cookie, 如果此时想在接口中处理cookie, 也需要设置为true。

2.后台接口跨域设置

当withCredentials设置为true时,后台跨域处理,头部“Access-Control-Allow-Origin” 不可以设置为 "*", 必须为确定的域名,

此时应设置为 Access-Control-Allow-Credentials: true;Access-Control-Allow-Origin:"<origin>"   *origin为发起请求的域名。

3.此时从a登陆后,调用b站提供的写入cookie的接口,可以从浏览器中看到已经把cookie写入了b站。但是此时通过前端却读取不到cookie, 例如使用document.cookie,或者$.cookie("user"),都无法获得cookie, 经过查阅后发现,此时写入的cookie只能通过http请求读取,也就是说只能在服务器端获得,前端无法读取。

例如csdn.net中的cookie, 当前userInfo这条cookie记录无法通过document.cookie,可以看到该条记录的http属性为true。

可以在后台写入cookie的时候设置cookie的httpOnly属性, 设置为false。例如使用koa框架,调用

ctx.cookies.set("userInfo", userInfo, {httpOnly:false})

这用设置的cookie信息即可在b网站通过前端读取到。

一个最简单的单点登陆实现。

猜你喜欢

转载自blog.csdn.net/lanix516/article/details/82686820
今日推荐