小程序登录(一)——微信用户授权登录

AI权益加码!Claude Code、Cursor等20+工具免费用! 购周边限时加赠Coding Plan Lite,畅享主流AI工具!学习进阶更高效! 阅读详情

微信用户授权登录,通过微信开放的接口与用户的授权,将微信的用户引流到我们自己的小程序下。

建议开发之前阅读一下微信开发官方文档:https://developers.weixin.qq.com/miniprogram/dev/framework/

首先我们说下,小程序的登录流程图:
微信登录流程图
主要的流程有如下几步:

  1. 微信小程序前端调用登录API,获取code与用户信息。
  2. 小程序将code与用户信息发送给开发者服务器,由服务器调用API进行登录凭证校验,获取用户的openId(用户唯一标识)和session_key(会话密钥)。
  3. 将用户信息存储与openId存储在自己数据库,生成系统的userId。
  4. 将userId进行JWT加密,响应token给前端。
  5. 前端将token存储至localstorage中,之后需要权限的请求,将token存储至请求头中。
  6. 后台通过AOP面向切面编程,对需要权限的url进行拦截,校验token的有效性,如果有效直接放行,否则拒绝请求。

前端调用API获取code
wx.login
调用实例:

getUserInfo: function(e) { //微信小程序另一个API,可以获取用户信息
       wx.login({//微信
微信小程序详细登录流程(图解+代码流程) 微信小程序登录和web端的登录点是不同的,小程序需要和微信的服务通信验证。 阅读详情

相关推荐

小程序学习笔记():用户微信授权登录

小程序学习笔记():用户微信授权登录 ,思路: 判断用户是否已经授权,若未授权,显示默认页面;已授权,则显示用户信息,并跳转至下页面。 默认页面:头像区域显示默认照片,底部有授权按钮。用户可通过点击授权按钮进行授权。 二,实现: 1,index.wxml: 头像区域:利用三元表达式,根据用户信息列表的头像属性值是否为空,判断头像区域显示照片来源,userInfo.avatarUrl为用户自身头像,defaultAvatarUrl为默认图片。 按钮显示:style属性设置display,根据用户是否已

measuringWorm的博客 582

简单实现小程序授权登录功能

今天给大家带来了关于微信小程序的相关知识,其中主要介绍了怎么实现小程序授权登录功能的相关内容,下面起来看下,希望对大家有帮助。在我们平时工作、学习、生活中,微信小程序已成为我们密不可分的部分,我们仔细留意下,每当我们使用个新的小程序时,总会遇到如下页面:这便是微信小程序授权登录功能了,授权登录后,我们就可以正常使用小程序,而小程序也会获取到我们的用户权益,手机号等个人信息。

qq974416775的博客 1万+

微信小程序授权登录的实现(button按钮)

前言:由于微信官方修改了 getUserInfo、authorize 接口,无法弹出授权窗口,所以现在无法实现进入微信小程序就弹出授权窗口,只能通过 button 去触发 1.实现思路 微信授权登录仅适用于使用微信用户信息的用户,如果自己的项目有完善的用户信息(套式开发项目),可不使用微信用户信息;如果仅为微信小程序,则要授权、获取用户信息 自己写微信授权登录页面让用户实...

woqianduo的博客 10万+

【已解决】开发者扫码登录提示“需要验证小程序密码”

我是将最近登录的其他几个账号都试了次,小程序都需要密码,公众号能直接登进去;公众号正常退出后,小程序也能正常登录了。

程序边界 2595

详解小程序常见的登录方式

基于 openid 或 手机号码快捷登录获取手机号码前置条件如何解决多账号的问题讲解前端、后端、微信登录过程中完整交互流程,方便更好去理解小程序登录

qq_16593939的博客 1万+

微信小程序三种授权登录的方式

灵活使用微信授权登录的功能 经过段时间对微信小程序的研发后 总结出以下三种授权登录的方式,我给他们命名为‘次性授权’‘永久授权’‘不授权’ 1.次性授权 常规写法,需要获取用户公开信息(头像,昵称等)时,判断调取授权登录接口,但是此方法如果不经处理的话 用户如果拒绝授权或者删除该微信小程序后 需要重新调取并获取用户公开信息(头像,昵称等),此方法用户体验较差,不建议使用; 2.永久授权 在...

qq_39759981的博客 6041

mpvue读书--个人中心01_页面+登录+扫

、个人中心大概实现流程 二、个人中心效果图 三、个人中心页面部分 个人中心页面的组成部分为 头像部分 进度条部分 扫扫部分 弹窗登录部分 文章目录、头像部分二、扫扫部分三、登录逻辑1、是否登录状态判断2、弹窗组件3、登录事件 、头像部分 用到了vuex中的用户信息(假设已经存入) 关于vuex配置 二、扫扫部分 用到了微信小程序api wx.scanCode文档 这里mpv...

kingAn123的博客 922

微信小程序全栈().通过授权登录解密获取用户的openid和unionid

    最近做微信小程序,有个功能需要甲触发A事件然后B收到甲的消息。毫无疑问就是要获取openid存下来与用户绑定了。然后可能有公众号对接进来,于是还是要求个unionid。这就不可避免要涉及个获取流程。    本来我以为是小程序端简简单单获取下腾讯的接口直接就返回回数据了,后来去官方文档看了下是前端把密文,偏移量,code发给后台,后台通过腾讯接口发送自己的AppId,AppSe...

TateBrwonJava的博客 1014

微信小程序Android和ios授权,uni-app之APP和小程序微信授权方法

uni-app 介绍uni-app 是个使用 Vue.js 开发跨平台应用的前端框架。适用平台:Android、iOS、微信小程序。实现了套代码,同时发布到Android、iOS、微信小程序。APP微信授权检测服务商检测手机上是否安装微信、QQ、新浪微博等。uni.getProvider({service: 'oauth',success: function (res) {console.lo...

weixin_29062255的博客 864

小程序 授权登录、token、code

文章目录、前言二、实现思路实现登录的代码流程图 、前言 由于微信官方修改了 getUserInfo 接口,所以现在无法实现进入微信小程序就弹出授权窗口,只能通过 button 去触发。 官方连接:https://developers.weixin.qq.com/community/develop/doc/0000a26e1aca6012e896a517556c01 二、实现思路 刚开始进入小程序时,先判断是否授权。 如果没有授权,显示授权button按钮,让用户实现点击的功能,就是通过 button

官方小可爱√的博客 1855

小白学习微信小程序开发中的用户登录授权

在获取到用户登录凭证 code 后,我们可以将该 code 发送给后端服务器,以便后端服务器通过微信提供的接口获取用户的唯标识 openid。用户登录授权微信小程序开发中非常重要的部分,通过本文的代码案例,我们了解了微信小程序用户登录授权的基本流程。在小程序的 js 文件中,我们需要监听按钮的点击事件,然后调用微信登录接口获取用户登录凭证 code。在小程序的 js 文件中,我们需要监听按钮的点击事件,然后调用微信授权接口获取用户的个人信息。获取到用户的个人信息,并进行后续的处理。

qq_67153941的博客 379

微信小程序开发中的用户授权登录功能

综上所述,本文通过个实际的案例详细讲解了微信小程序中的用户授权登录功能的开发步骤。通过用户授权登录,我们可以获取用户信息和登录凭证,实现个性化功能和数据展示。通过用户授权登录用户可以使用自己的微信账号登录小程序,获取个人信息和权限,实现个性化功能和数据展示。本文将通过个实际的案例,详细讲解微信小程序中的用户授权登录功能的开发步骤。在小程序中,用户登录凭证code是非常重要的,后续我们会使用该凭证向服务器发送请求,获取用户的唯标识和会话密钥。是个API,用于获取用户登录凭证code。

吃不胖. 589

近期你已经授权登录过_微信上怎么登录QQ 微信和qq有什么实质区别

参加工作之后,大多数人都将自己常用的聊天软件换成了微信,QQ也渐渐不再使用。但是,QQ中基本上都是小学、初中、高中的好友以及同学,这些人的消息我们也是不想错过的。近期,有网友称微信上可登录QQ,那么微信上可登录QQ是真的吗?下面就和小编起来看看微信上怎么登录QQ以及微信和qq有什么实质区别。微信上可登录QQ是真的吗微信上可登录QQ是真的吗?11月26日消息,根据网友反馈,目前腾讯QQ已经正式...

weixin_39531229的博客 923

FinClip 小程序怎么拉起微信登录

打开小程序后就可以授权允许小程序使用自己的微信头像,昵称,手机号或相关信息,完成更加便利的操作使用是再正常不过的件事情。

finogeeks的博客 341

微信小程序通过非登录(获取用户信息和code)的方式获取token

这里写自定义目录标题1.token获取方式有两种: 1.token获取方式有两种: 用户登录成功后后台返回token,般会把返回的token缓存起来 通过用户授权获取用户的相关信息和code等参数,后台提供接口将这些参数传进去,就可以返回token 接下来要说的就是第二种方式获取token,般在微信支付 创建订单的时候需要用到token 在 ...

qianduan1020的博客 2970

微信端开发--登录小程序

这个小程序的主要目的是为了用户微信用户信息登录后将用户信息授权存入自己的数据库中,这样以后每次微信登录得到的code 所得到的 openid 可以在项目的数据库中查到该用户的相关信息。在测试的过程中,需要用户登录得到的code,所以会用到微信开发小工具~! 该工具的使用必须被项目授权所生成的code是有时间限制的微信登录端口的api如下接口地址:https://api.weixin.qq.co

ivyChen的专栏 1万+
上一篇: 小程序商城后台技术选型
下一篇: 小程序登录(二)——通过JWT实现权限认证
spring_dog
博客等级 码龄7年 2粉丝 6原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值