基于vue实现微博三方登录流程解析


Posted in Javascript onNovember 04, 2020

1.微博三方登录流程

基于vue实现微博三方登录流程解析

1.1 前端获取认证code

1.在Vue页面加载时 动态发送请求获取微博授权url

2.django收到请求的url后,通过微博 应用ID(client_id)和回调地址(redirect_uri) 动态 生成授权url返回给Vue

3.当用户点击上面的url进行扫码,授权成功会 跳转我们的回调界面并附加code参数

4.Vue获取到微博返回的code后,会 将code发送给django后端 (上面的redirect_uri)

1.2 获取微博access_token

后端获取code后,结合client_id、client_secret、redirect_uri参数进行传递,获取微博access_token

1.3 获取微博用户基本信息并保存到数据库

使用获得的access_token调用获取用户基本信息的接口, 获取用户第三方平台的基本信息

用户基本信息 保存到数据库,然后关联本地用户 ,然后将用户信息返回给前端

1.4 生成token给Vue

django后端借助微博认证成功后,可以 使用JWT生成token ,返回给Vue

Vue将token存储到localStorage中 ,以便用户访问其他页面进行身份验证

2.第三方登录与本地登录的关联(三种情况)

2.1 情况1: 本地未登录,第一次登录第三方

此时相当于注册,直接把第三方信息拉取来并注册成本地用户就可以了,并建立本地用户与第三方用户
(openid)的绑定关系

2.2 情况2:本地未登录,再次登录第三方

此时用户已注册,获取到openid后直接找出对应的本地用户即可

2.3 情况3:本地登录,并绑定第三方

这个只要将获取到的openid绑定到本地用户就可以了

3.oauth认证原理

OAuth是一个开放标准,允许用户让第三方应用访问该用户在某一网站上存储的私密的资源,而无需将用户名和密码提供给第三方应用。

OAuth允许用户提供一个令牌,而不是用户名和密码来访问他们存放在特定服务提供者的数据。这个code如果能出三方换取到数据就证明这个用户是三方真实的用户

4.为什么使用三方登录

服务方希望用户注册, 而用户懒得填注册时的各种信息(主要是为了保证用户的唯一性,各种用户名已占用,密码格式限制).

而像微信, QQ, 微博等几乎每个人都会安装的应用中用户肯定会在其中某一个应用中已经注册过,证明该用户在已经注册的应用中的唯一性.

第三方登录的实质就是在授权时获得第三方应用提供的代表了用户在第三方应用中的唯一性的openid.并将openid储存在第三方服务控制的本地储存.

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用javascript动态调整iframe高度的代码
Apr 10 Javascript
document.designMode的功能与使用方法介绍
Nov 22 Javascript
JQuery的Validation插件中Remote验证的中文问题
Jul 26 Javascript
JavaScript判断变量是否为undefined的两种写法区别
Dec 04 Javascript
Js实现双击鼠标自动滚动屏幕的示例代码
Dec 14 Javascript
javascript页面渲染速度测试脚本分享
Apr 15 Javascript
js兼容pc端浏览器并有多种弹出小提示的手机端浮层控件实例
Apr 29 Javascript
js仿微博实现统计字符和本地存储功能
Dec 22 Javascript
Babel 入门教程学习笔记
Jun 13 Javascript
微信小程序tabbar底部导航
Nov 05 Javascript
微信小程序自定义弹窗实现详解(可通用)
Jul 04 Javascript
js 实现 list转换成tree的方法示例(数组到树)
Aug 18 Javascript
Javascript执行上下文顺序的深入讲解
Nov 04 #Javascript
解决vant中 tab栏遇到的坑 van-tabs
Nov 04 #Javascript
解决Mint-ui 框架Popup和Datetime Picker组件滚动穿透的问题
Nov 04 #Javascript
基于js实现的图片拖拽排序源码实例
Nov 04 #Javascript
在vant中使用时间选择器和popup弹出层的操作
Nov 04 #Javascript
vue 判断两个时间插件结束时间必选大于开始时间的代码
Nov 04 #Javascript
vant 时间选择器--开始时间和结束时间实例
Nov 04 #Javascript
You might like
javascript 小型动画组件与实现代码
2010/06/02 PHP
深入理解PHP JSON数组与对象
2016/07/19 PHP
php实现贪吃蛇小游戏
2016/07/26 PHP
iis 7下安装laravel 5.4环境的方法教程
2017/06/14 PHP
php查看一个变量的占用内存的实例代码
2020/03/29 PHP
document对象execCommand的command参数介绍
2006/08/01 Javascript
利用JS自动打开页面上链接的实现代码
2011/09/25 Javascript
浅谈Javascript事件模拟
2012/06/27 Javascript
学习JavaScript设计模式(链式调用)
2015/11/26 Javascript
js 去掉字符串前后空格实现代码集合
2017/03/25 Javascript
vue如何引用其他组件(css和js)
2017/04/13 Javascript
Redux 和 Mobx的选择问题:让你不再困惑!
2017/09/18 Javascript
浅谈Vue render函数在ElementUi中的应用
2018/09/06 Javascript
微信小程序登录态和检验注册过没的app.js写法
2019/05/22 Javascript
Vue.js标签页组件使用方法详解
2019/10/19 Javascript
vue 组件内获取actions的response方式
2019/11/08 Javascript
[03:07]【DOTA2亚洲邀请赛】我们,梦开始的地方
2017/03/07 DOTA
python求素数示例分享
2014/02/16 Python
django实现登录时候输入密码错误5次锁定用户十分钟
2017/11/05 Python
python 实现围棋游戏(纯tkinter gui)
2020/11/13 Python
pytorch Dataset,DataLoader产生自定义的训练数据案例
2021/03/03 Python
亚历山大·王官网:Alexander Wang
2017/06/23 全球购物
银行会计业务的个人自我评价
2013/11/02 职场文书
心得体会怎么写
2013/12/30 职场文书
会计主管岗位职责
2014/01/03 职场文书
会计工作心得体会
2014/01/13 职场文书
《走一步再走一步》教学反思
2014/02/15 职场文书
家长学校工作方案
2014/05/07 职场文书
小区推广策划方案
2014/06/06 职场文书
无子女夫妻离婚协议书(4篇)
2014/10/20 职场文书
社区党支部承诺书
2015/04/29 职场文书
Vue全家桶入门基础教程
2021/05/14 Vue.js
MySQL 发生同步延迟时Seconds_Behind_Master还为0的原因
2021/06/21 MySQL
Oracle安装TNS_ADMIN环境变量设置参考
2021/11/01 Oracle
解决Springboot PostMapping无法获取数据的问题
2022/05/06 Java/Android
MySQL脏读,幻读和不可重复读
2022/05/11 MySQL