CAS单点登录-第三方登录[QQ、微信、CSDN、GitHub]（十四）

CAS单点登录-第三方登录[QQ、微信、CSDN、GitHub]（十四）

注: 目前博文使用cas版本为5.1.5，由于5.2.x与5.1.x构建模式有差异，所以部分配置会有些偏差。

本章内容

• 简答介绍OAuth2
• 微信登陆
• CSDN登陆
• GitHub登陆
• QQ登陆

#介绍
很多朋友问我，怎么集成QQ、微信、CSDN、GitHub、微博等等第三方登录，所以我也只要简单列一下如何集成第三方登录，当然这次做的demo只做测试教程使用，上线还需要界面的调整以及第三方登录的审核。

目前用的第三方登录几乎都是采用授权的OAuth2协议（有必要了解）

简单来说就是，客户端请求第三方服务，用户在第三方服务登录成功，第三方服务给客户端token，最后客户端采用token可以获取第三方提供的接口

#实战

添加依赖

<dependency>
     <groupId>org.apereo.cas</groupId>
     <artifactId>cas-server-support-pac4j-webflow</artifactId>
     <version>${cas.version}</version>
 </dependency>

做了相关配置，会有Pac4j相关的debug信息：

CSDN授权登陆

创建应用

登录csdn并且创建应用，我要打开具体地址

创建应用具体如下：

接口信息

我要查看CSDN官方文档

授权接口

由上图可知：

1. 授权路径为：http://api.csdn.net/oauth2/authorize
2. appid参数名为：client_id（有些开放平台为app_id、appId等等刚好cas配置的appid的参数名为client_id，若不是需要做调整）

access_token接口

由上图可知：

1. token路径为：http://api.csdn.net/oauth2/access_token
2. secret参数名为：client_secret（有些开放平台为secret等等刚好cas配置的secret的参数名为client_secret，若不是需要做调整）

用户信息接口

我要查看API文档

非常的明显，用户信息接口为：http://api.csdn.net/user/getinfo

该json数据为csdn用户数据的报文数据，具体文档点击

{
	"username":"u010475041",
	"job":"java程序员",
	"workyear":"",
	"website":"",
	"description":"喜欢研究新技术，对大数据处理、系统架构、高并发、支付金融类系统非常感兴趣。平时喜欢旅游、音乐。"
	}

到此CSDN的授权登录所具备的信息基本获取了

SSO配置

application.properties

#CSDN OAuth Login
#appid
cas.authn.pac4j.oauth2[0].id=1100557
#分配秘钥
cas.authn.pac4j.oauth2[0].secret=3687d9d2e9e44bc0b48847d541449c14
#授权接口
cas.authn.pac4j.oauth2[0].authUrl=http://api.csdn.net/oauth2/authorize
#token获取接口
cas.authn.pac4j.oauth2[0].tokenUrl=http://api.csdn.net/oauth2/access_token
#用户信息接口
cas.authn.pac4j.oauth2[0].profileUrl=http://api.csdn.net/user/getinfo
cas.authn.pac4j.oauth2[0].profileAttrs.id=username
cas.authn.pac4j.oauth2[0].clientName=CSDN

打开登录页结果如下：

看到如下，恭喜你~

GitHub授权登录

而GitHub的授权登录就更为简单了，举一反三~
为什么说简单呢，因为cas为我们准备好了接口信息，不用我们去找了，也就是说，到github申请appid以及获取秘钥即可，哈哈哈哈~

创建应用

点击打开创建应用

当然啦，创建成功会给我们分配秘钥的

SSO配置

这些就不多说啦~

application.properties

#GitHub OAuth Login
cas.authn.pac4j.github.id=b5f93226ece4b6dcb71b
cas.authn.pac4j.github.secret=34a319d36e5d3bead3c242ffb5172d49511b48fe
cas.authn.pac4j.github.profileAttrs.id=id
cas.authn.pac4j.github.client-name=github

马上重启试试~

再次恭喜你~

微信授权登录

重头戏，这个就稍微跟前面的有点不一样了~

创建应用

授权到测试公众号平台申请测试号，当然有正式的更好。。。

其实我们就是要这个效果。。。

---

我们登录了，测试平台就默认给我们创建了一个应用~

设置回调域名

接口信息

我要打开微信扫描登录文档

授权接口

由上图得知：

1. 授权路径为：https://open.weixin.qq.com/connect/qrconnect
2. appid参数为：appidcas默认为client_id，需要做调整
3. 网页授权登录scope=snsapi_login需要做调整

access_token接口

由上图得知：

1. access_token路径为：https://api.weixin.qq.com/sns/oauth2/access_token
2. appid参数为：appidcas默认为client_id，需要做调整
3. secret参数为：secretcas默认为client_secret,需要做调整

经过源码com.github.scribejava.core.oauth.OAuth20Service#createAccessTokenRequest的分析

很可惜不符合pac4j的默认请求，那么有以下几个解决办法：

1. 添加一个中转程序，把access_token路径让中转程序接管，中转程序请求到微信，再返回给sso程序即可（推荐）
2. 修改cas以及pac4j源码，添加自己的部分逻辑（不推荐）

用户信息接口

由上图得知：

1. 用户信息接口为https://api.weixin.qq.com/sns/userinfo

SSO配置

application.properties

#WeChat OAuth Login
cas.authn.pac4j.oauth2[1].id=wxac0f1c863937d067
#由于微信的不为clinet_id，为appid
cas.authn.pac4j.oauth2[1].customParams.appid=wxac0f1c863937d067
#微信scope登录为snsapi_login
cas.authn.pac4j.oauth2[1].customParams.scope=snsapi_login
cas.authn.pac4j.oauth2[1].secret=bfeedc350fe15f45315a0ab67643085e
cas.authn.pac4j.oauth2[1].authUrl=https://open.weixin.qq.com/connect/qrconnect
cas.authn.pac4j.oauth2[1].tokenUrl=https://api.weixin.qq.com/sns/oauth2/access_token
cas.authn.pac4j.oauth2[1].profileUrl=https://api.weixin.qq.com/sns/userinfo
cas.authn.pac4j.oauth2[1].clientName=WeChat

---

哎呀，对不起大家，

• 获取不到能够成功测试的应用，非常抱歉
• 没有测试到access_token，非常抱歉
• 没有提取到用户信息，非常抱歉

QQ授权登录

申请成为开发者
接入文档

qq登录更奇葩，恐怕在cas中做的话就比较吃力了，除非cas开放了自定义OAuth2的配置定义

奇葩1: 开发者审核需要拍照上传。。。
奇葩2: 用户信息返回jsonp(解决办法，通过中转程序来做这个用户信息的适配)
奇葩3: access_token获取报文不是json

创建应用

SSO配置

#QQ OAuth Login
#QQ OAuth Login
cas.authn.pac4j.oauth2[2].id=101433938
cas.authn.pac4j.oauth2[2].secret=ad4fef7e3fb785a51026aaf78121eff0
cas.authn.pac4j.oauth2[2].authUrl=https://graph.qq.com/oauth2.0/authorize
#原路径
#cas.authn.pac4j.oauth2[2].tokenUrl=https://graph.qq.com/oauth2.0/token
#由于返回非json，做代理转发
cas.authn.pac4j.oauth2[2].tokenUrl=http://localhost:8808/token/qq
#原路径
#cas.authn.pac4j.oauth2[2].profileUrl=https://api.weixin.qq.com/sns/userinfo
#中转帮忙做这个jsonp的转发动作，具体看sso-client-demo/sso-client-proxy-demo模块
cas.authn.pac4j.oauth2[2].profileUrl=http://localhost:8808/user/qq
cas.authn.pac4j.oauth2[2].profileAttrs.id=openid
cas.authn.pac4j.oauth2[2].profileAttrs.client_id=client_id

温馨提示

OAuth2的参数标准：

测试成功：

• CSDN授权登录
• GitHub授权登录
• QQ授权登录

启动模块

1. sso-config-server
2. cas-client-demo
3. cas-proxy-demo
4. sso-server

测试

测试时发访问http://localhost:8080/sample

注意要点

1. 微信、QQ第三方登录与标准的OAuth2有些差异，需要进行调整
2. 测试时需要启动以上所有模块，也可以采用根目录build.cmd run启动所有服务进行测试
3. 以上仅仅做学习记录参考，在生产用程序需要更加严谨

---

下载代码尝试：[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-qYObMI3F-1611805635516)(https://img.shields.io/badge/downloads-v1.6.0_RC2-brightgreen.svg)] 其他版本可以到GitHub或者码云查看

发现一些意外的事情可以考虑翻翻前面的博客进行学习哦

作者联系方式

如果技术的交流或者疑问可以联系或者提出issue。

邮箱：huang.wenbin@foxmail.com

QQ: 756884434 (请注明：SSO-CSDN)