三方登录流程

目录

三方登录流程拆解

1.用户触发三方登录，调起三方登录页面

时序图

关键流程

2.三方回调系统后续流程

时序图

关键流程

Google

1.配置三方

2.修改项目配置参数

3.注意事项

Facebook

1.配置三方

2.修改项目配置参数

3.注意事项

Twitter

1.配置三方

2.修改项目配置参数

3.注意事项

Apple

apple与其他三方登录流程区别

1.配置三方

2.修改项目配置参数

---

三方登录主要阐述海外三方对接流程（Google、FaceBook、Apple、Twitter）

可以先了解一下Oauth2四种授权模式，本文采用的是授权码模式（Authorization Code）

https://www.jianshu.com/p/d24d66ae040e

三方登录流程拆解

分为以下两个步骤阐述

1.用户触发三方登录，调起三方登录页面

时序图

关键流程

节点1【算法模式，二开可重写钩子方法加载所需要的三方适配器实例】:

ThirdPartAdapterFactory工厂：通过spring的@PostConstruct 的注解，定义了初始化三方登录工厂的算法。

1. 加载配置文件，获取clinetID、clientSecret、callbackUrl等信息，调起三方网站时需要携带这些信息。
2. createPcThirdPartAdapter() 方法是一个钩子方法，作用是创建具体的三方适配器的实例。正因为是钩子方法，项目二开可以重写此方法，来注入项目所需要的三方适配器实例。
3. 该方法首先会从AdapterBuilderFactory中获取AdapterBuilder实例，然后调用该实例的buildAdapter（）方法，获取三方适配器实例。

【需要注意】：AdapterBuilderFactory该工厂的bean注入必须要早于ThirdPartAdapterFactory，否则项目启动时，将出现由于类加载顺序的问题导致的空指针异常。

节点4：

1. 初始化三方登录信息
2. 根据传入三方信息从工厂获取三方适配器实例
3. 动态生成state（三方登录信息存入session中）
4. 从三方适配器中动态生成三方认证URL
5. 重定向三方认证URL

【需要注意】：动态生成state很必要，三方回调时，需要比对state值，可以确保三方回调消息的可靠性。

2.三方回调系统后续流程

上述步骤描述到：由三方回调系统页面，此时三方会携带auth_code（系统将通过这个code去再次请求三方获取到用户的三分信息）、state（根据传入的 state ，还原认证请求的原始请求对象）。由前端调起后台接口（/auth-new/{thirdPartType}）。

时序图

关键流程

draco底层引入第三方jar包：scribejava。项目开源了有关facebook、Google、Github等三方登录流程  GitHub - scribejava/scribejava: Simple OAuth library for Java

节点5

通过三方返回的auth-code，组装调用第三方请求，并返回OAuth2AccessToken信息。项目上对获取AccessToken信息封装了一层（通过调用getAccessToken（）方法）。

若需要接入其他三方，而scribejava未提供该功能，则需要二开组装AccessToken请求参数以及携带该参数调用第三方接口（即重写PcThirdPartAdapter中getAccessToken（）方法）。【例如：twitter】

节点6

根据AccessToken信息，获取三方用户信息。Google和Facebook 可以直接拿到用户的email和手机号（可以根据项目需求，配置是否需要跳转绑定手机号或电子邮件页面）。

为了确保用户的唯一性，在创建一个真实用户（游客除外）的时候需要确定唯一的email或手机号，否则会导致一个email或者手机号对应多个用户信息。

节点10

后台会校验是否获取到email或者是手机号信息，未抛出异常则创建或绑定成功。抛出异常信息，前端会捕获异常提示，从而跳转对应的页面。并进行一个手机号码或者是邮件的绑定操作。至此一个三方用户便创建成功。

节点14

若步骤9创建三方登录未传入email或手机号则需要将已经组装好的三方用户信息写入session的attribute中，key为third_part_user_info_mark

Google

1.配置三方

（以下访问的网站均为外网，建议打开阿里郎加速， 才用的均是OAuth2.0协议）

1.首先申请Google账号，然后进入网页：Google Cloud Platform的开发者模式

地址：https://console.cloud.google.com/welcome?project=locket-login

选择该页面oauth同意屏幕。创建自己的应用。具体操作如此下所示：

添加自己需要授权的url和domain:

同时得到client_id和client_secret

2.修改项目配置参数

修改项目中client_id、client_secret、callback-url参数

3.注意事项

Google添加的url必须精确到后面的参数

例如:https://www.coohom.com/xxxx/google 添加的url是这个 如果我们请求的页面是https://www.coohom.com/xxx/google?domain=YWxwaGEuY29vaG9tLmNvbQ== 后面多加了一个参数，则会请求失败。这里必须确认参数全部正确。

Google的回调请求是get。可以直接回调页面也可以回调接口（若无需使用标品的绑定邮箱或者手机号的功能，则可以配置成回调接口，项目上二开该接口——系统可以在Google三方登录信息中获取到手机号和邮箱信息）

Facebook

1.配置三方

1.首先在 https://developers.facebook.com 开通Facebook开发者账号
2.创建应用，这里可以选择无。填相应信息确认创建应用。

3.点击Facebook设置。 设置这里一定要填写对应的域名（此处有坑需注意，之前一直没有填此处，导致可以成功进入授权页面却获取不到用户信息，排查了很久）

4.输入自己需要访问跳转的网址(redirect_url) 保存修改 需要注意

5.打开设置中的基本：记录应用编号和应用密匙。即为程序中的client-id和client-secret。

6.（坑 需注意关键一步 这里一定要选择上线，否则会处于开发模式。即登录授权的网址只有开发的这个用户才可以登录成功，其余账号仍没有办法成功登录）至此三方授权完成。

2.修改项目配置参数

3.注意事项

Facebook添加的url参数也应该精确（Facebook与Google相同）

例如:https://www.coohom.com/xxxx/facebook如果我们进行请求https://www.coohom.com/xxxx/google?domain=YWxwaGEuY29vaG9tLmNvbQ==则会出现一下情况： 点击确认后会正确返回首页，没有任何问题。但是为了防止出现这种情况，我们还是应该正确写清楚其url。

Twitter

1.配置三方

1.申请twitter开发者账号，进入网页：https://developer.twitter.com/en/portal/products

配置域名和回调地址 （域名只能配置一个，回调地址可以配置多个——请求三方时系统带着回调地址等信息访问三方，三方判断传入的回调地址与配置的回调地址是否匹配，不匹配则抛出回调地址异常信息）

配置完成之后得到Client ID 和Client Secret

2.修改项目配置参数

3.注意事项

Twitter 无法获取到三方用户的邮箱或电话号码等信息，所以回调之后需要在跳转到绑定手机号/邮箱页面

Apple

apple与其他三方登录流程区别

1.apple的回调地址是一个post请求，所以需要先跳转前端页面

2.apple会多一个p8文件，也需要配置在系统中

3.苹果的域名虽然可以多选，但是只能配置一个域名，否则导致回调地址找不到的情况（也就是说一套环境配置一套三方登录，不过域名和回调地址等信息可以更改，clientid等信息不回随着这个的更改而更改）

1.配置三方

登录苹果开发者平台：https://developer.apple.com/programs/

苹果开发者账号是收费的$99

建议参考文档：What the Heck is Sign In with Apple? | Okta Developer

2.修改项目配置参数