A平台要接入B平台, 使用的方式是iframe引入, A平台登录后, B平台要自动登录, A和B的域名不同, 实现的方式是, A平台在iframe的src参数上携带了登录需要的参数, code和clientId, B平台拿到参数后发送给自己的后端服务, 后端服务校验成功返回token, B平台将token写入自己的域名下, 完成单点登录的流程.
问题出在写入cookie的时候, 写入失败了, 一开始我以为B平台在自己的域名下写cookie, 应该是可以正常写入的, 最后发现浏览器对这种情况还是有限制的, 需要设置cookie的Secure和SameSite, Secure属性是是否限制必须https协议的, SameSite属性有三个值, 是设置是否可以写入第三方cookie的, 像iframe嵌入的页面就是第三方cookie, 如果设置成None, 表示不会限制, 可以写入, 同时Secure必须设置为true, 否则不生效, 具体解释见
我在项目中使用vue-cookie插件, 我的设置是做全局设置, 代码如下:
//domain可以看情况设置, 项目需要, 所以进行了设置
Vue.$cookies.config(-1, '/', domain, true, 'None')
这样就可以写入第三方cookie了, 同时sessionStorage和localStorage是可以自由写入到自己的域名下的, 没有同源限制.
