这个题目可能有点大了,这里主要讨论一种解决safari浏览器阻止第三方cookie问题。
场景
公司存在多个域名(a.com,b.com,co.com)这些域名应该统一帐号状态,a.com为公司主域名,其中帐号系统为passport.a.com,b.com现在做一个活动,需要用户进行登录,那么就跳转到passport.a.com进行登录,登录完成完根据参数会跳至活动页面。由于passport.a.com使用的jsonp的形式对a.com,b.com和c.com就行设置登录状态操作(在(如何创建帐号统一服务)中有详细说明),其他浏览器(chrome、ff、IE等)在默认浏览器配置下都没有问题,只有在safari下存在这个问题,原因在于:safari隐私设置,默认阻止第三方cookie设置,但是只要你访问过一次(这里的访问必须是用户手动操作,不能通过JS进行跳转操作)它就允许了。如果是这种情况,那么登录成功跳转回去,用户在b.com或c.com仍然没有登录状态?
尝试解决方案
1. 将页面放在自己服务器下面
也就是说,将passprot.a.com的登录页面在b.com下自己在实现一次,这样可以保证b.com有登录状态,但是存在一下几点问题:
- 实现成本问题,将登录这么复杂的逻辑需要自己实现并维护,不利于构建统一的帐号服务体系,增加维护成本
- 只完成了登陆b.com,并不能登录a.com和c.com,没有完成帐号状态的同步
- 如果登录出现验证码而验证码又不是b.com提供的服务,同样会出现cookie无法校验的问题
2. 代替用户访问一次需要的域名
- 通过前端事件访问,可以模拟用户点击或者直接location跳转,经过测试发现这种方案不靠谱
- 通过服务端跳转,b.com访问一个jump.a.com专门做跳转处理,可以再到b.com这样的话就能操作a.com的cookie,但是在登录场景还是没有办法使用,原因可以参考上面的解释
3. 服务端302跳转的形式
既然第三方不能操作,那就使用自己的子域就行操作就行了。首先保证自己的东西都放在自己的域名下处理,如果必须要引入第三方的接口时,可以考虑将之前的jsonp请求,转化为302跳转的方式实现。这种形式也有问题,safari浏览器最大的跳转次数是15次,超过15次浏览器就会无法解析。各浏览器302次数限制可以查看浏览器重定向(302)次数限制问题。
确定方案
以上几种方案,可以根据自己业务的实际情况选择合适的方式。
针对本文最初提到的场景,我们的解决方案是使用,服务端302跳转代替jsonp请求的方式完成的。整个实现的流程大致如下:
这样就完成了所有域名登录状态的设置,准确来说是所传域名列表会被设置上登录状态。
总结
这里是以登录为例,解决safari浏览器默认阻止第三方cookie问题的,在其他场景下看情况使用不同的方案,当然在这里也是抛砖引玉,希望能得到更好,更方便的实现方式。再说点儿题外话,讨论这个方案用了不少时间,有很多方案很简单但是我们不能使用是考虑到我们的实现成本问题,已经对用户的影响,这种情况下,尽可能少的让用户来操作什么完成你本身就应该完成的事情。总之一个原则,能不让用户做的尽量别让用户做,用户的认知成本和学习成本你都是无法评估的。