OAuth 第三方登录获取用户信息流程优化

OAuth 简单流程

简单的介绍一下的 OAuth 登录流程。

1. 首先，用户点击当前 网站应用 的第三方登录按钮，跳转到第三方页面进行授权。

2. 授权成功之后，回跳到 网站应用 设置的回调地址并且地址带上 access_code 参数。

3. 网站应用使用 access_code 获取用户信息，设置当前登录态。

常见的两种做法

A. 前端设置登录态

在 OAuth 登录流程的第二步，前端获取地址栏 query 参数 access_code 值，向后端请求解析此 access_code ，并且设置登录态。

优点: 不需要后端介入，只需要提供 access_code 解析 API。

缺点: 用户在前端会看到多次跳转，全流程耗时会根据用户网络状态波动。

B. 服务端设置登录态

在 OAuth 登录流程的第二步，通过服务端渲染，在服务端解析 query 参数 access_code 值，在服务端直接解析，设置并且重定向到最终页。

优点：用户不会看到多次跳转，响应速度快。

缺点：需要服务端介入，成本高。

总结

在服务端设置登录态的用户体验要好于前端设置登录态。

如果项目是 SSR 模式，成本不会太高，建议直接使用服务端设置登录态。

纯前端项目无特别的要求可以使用前端设置登录态。

本站 Github 登录目前采用的是前端设置登录态模式，登录会经过中间页跳转。

cnodejs 论坛则采用的是服务端设置登录态模式，登录直接在服务端重定向。

可以去体验一下这两者之间的细微差别。