第三方登录实现步骤:

 

第三方登录授权的流程:

 

1.说出是前端访问我们自己的定义url,然后在我们自己的后台去调用第三方后台给的url,把后端生成的url返回给前端,也就是登录页面,

 

2.前端使用location.href重定向获取code,

 

3.拿着获取的code去获取的access_token,(微博使用post,qq使用post,get都可以),

 

4.拿着access_token去获取用户openid或uid(唯一id),

 

5.判断我们用户表是不是有uid或openid,如果没有返回给用户绑定页面,

 

6.判断输入的用户名和密码是否存在,

 

7.不存在,创建用户,并保存到user表和第三方表,

 

8.存在,则直接关联,

 

 

第一步:

微博开放平台 https://open.weibo.com 进行注册:

微博 javascript 微博登录_第三方登录

微博 javascript 微博登录_微博 javascript_02

 

第二步:

点击微博先请求我们自定义的接口,

微博 javascript 微博登录_登录页面_03

 

微博 javascript 微博登录_第三方登录_04

 

微博 javascript 微博登录_第三方登录_05

 

注意我们的回调地址!!!

微博 javascript 微博登录_微博 javascript_06

微博 javascript 微博登录_微博 javascript_07

生成这个url之后 需要返回到前端进行 微博登录页面的展示例如:

微博 javascript 微博登录_登录页面_08

 当微博账号验证登录之后,我们的回调地址 就起到作用了,这个绑定页面会立马展现,页面加载瞬间把code 发送后台,来我们接着看。

 

微博 javascript 微博登录_post请求_09

 来我们顺着来到后台

微博 javascript 微博登录_第三方登录_10

我们再一次向微博平台 发起post请求,主要是为了取用户uid,

取到uid 之后 我们先到第三方表里进行判断该用户是否存在,如果该用户存在,则直接把token等信息返回到前端,直接登录即可。

微博 javascript 微博登录_微博 javascript_11

来 我们看看前端 是如何处理这个数据的,正常重定向主页 即可。

微博 javascript 微博登录_post请求_12

如果该 用户第一次登录,来我们接着看逻辑

生成token 直接返回前端,

微博 javascript 微博登录_post请求_13

我们看看前端如果处理回复,下面是个if 判断 ,控制我们的绑定页面输入框的展示。

微博 javascript 微博登录_微博 javascript_14

微博 javascript 微博登录_微博 javascript_15

当用户把点击保存之后,我们看看url请求,

微博 javascript 微博登录_登录页面_16

 我们接着看后台,直接来到了apiview 的post请求进行逻辑判断,

微博 javascript 微博登录_微博 javascript_17

在上面的序列化器中 我们先判断的 是用户携带的token,是否合法,然后再进行短信验证码的判断。

微博 javascript 微博登录_登录页面_18

重点看看这里 ,我们先去user表里,也就是 我们第三方登录的表关联的user表 判断该用户的 密码。

 

微博 javascript 微博登录_第三方登录_19

当我们 取到user信息之后,直接进行user表的保存,以及第三方标的信息保存。