热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

小程序微信登入

以下代码基于uni-app编写如果没有appid,那么uni-login是受限制的https:open.weixin.qq.com认证商户()微信登入不同的应用对于微信登入会做不

以下代码基于uni-app编写 如果没有appid,那么uni-login是受限制的



https://open.weixin.qq.com/ 认证商户()



微信登入

不同的应用对于微信登入会做不同的处理,即微信服务器(微信官方的)返回发送的OpenId是不相同的(后面会解释OpenId是干嘛用的,它涉及到数据库)。因此也有
UnionID


UnionID 机制说明
如果开发者拥有多个移动应用、网站应用、和公众帐号(包括小程序),可通过 UnionID 来区分用户的唯一性,因为只要是同一个微信开放平台帐号下的移动应用、网站应用和公众帐号(包括小程序),用户的 UnionID 是唯一的。换句话说,同一用户,对同一个微信开放平台下的不同应用,UnionID是相同的



本站后端服务后一部分(已经获取到OpenId,UnionID或者请求,暂时叫身份标识VID)

当客户端已经发送带有VID的东西是,可以存入数据库表(
表是user表个id, VID, name, avatarUrl等字段

,注意,获取到VID先查询是否存在,不存在则插入新增一条记录,否则检验name和VID是否匹配(其实可以只检查VID),检验成功则表示登入成功(这里可以使用正常的前后端登入逻辑,如token等),返回数据给客户端。


App端


AppSDK配置里的微信登入appid和appsecret需要填写,开发时暂时可以随便写,如果上线要申请微信的(微信开发者平台)


app端可以直接通过接口获取第三方接口:通过发送发送自带的login请求,再响应成功后,获取到VID,再次请求getUserInfo,响应成功获取用户微信已有信息,向本站服务器发起登入请求,携带VID(一般还有头像和名称)

export default {data() {return {};},//生命周期onLoad:function(){//app 端微信登录// 手册位置 https://uniapp.dcloud.io/api/plugins/login?id=getuserinfo// #ifdef APP-PLUS 判断环境uni.login({success: (res) => {// res 对象格式//{"code":"***",//"authResult":{//"openid":"***",//"scope":"snsapi_userinfo",//"refresh_token":"**",//"code":"****",//"unionid":"***",//"access_token":"***",//"expires_in":7200//},//"errMsg":"login:ok"}uni.getUserInfo({success: (info) => {// info 对象格式// {"errMsg":"getUserInfo:ok",// "rawData":"...// "userInfo":{//"openId":"***",//"nickName":"***",//"gender":1,// "city":"Xi'an",// "province":"Shaanxi",// "country":"China",// "avatarUrl":"头像",// "unionId":"oU5Yyt_agt547zWyA0v0eLfFPqxo"//},"signature":""}// 与服务器交互将数据提交到服务端数据库},fail: () => {uni.showToast({title:"微信登录授权失败"});}})},fail: () => {uni.showToast({title:"微信登录授权失败"});}})// #endif}
}

小程序端


进入小程序后台管理,点击开发 => 开发设置 可以看到id和serect,注意改变manifest.json配置即可,后端也是需要这些数据的,下面会讲到


<template><view><button type="primary" open-type="getUserInfo" @getuserinfo="getUserInfo">使用微信登录button>view>
template>

var _self, pageOptions, session_key, openid;
export default {data() {return {};},methods:{// #ifdef MP-WEIXINgetUserInfo : (info) => {info = info.mp.detail.userInfo;//userInfo {"nickName":"深海","gender":1,...avatarUrl":"https://7tdPvkPaJlkaLFFbLAffGVApluZdanLkDVplNlAhq1EJA/132"}// 与服务器交互将数据提交到服务端数据库uni.request({url: _self.apiServer+'member&m=login',method: 'POST',header: {'content-type' : "application/x-www-form-urlencoded"},data: {openid : openid,name : info.nickName,face : info.avatarUrl,},success: res => {console.log(res);res = res.data;// 登录成功 记录会员信息到本地if(res.status == 'ok'){uni.showToast({title:"登录成功"});uni.setStorageSync('SUID' , res.data.u_id + '');uni.setStorageSync('SRAND', res.data.u_random + '');uni.setStorageSync('SNAME', res.data.u_name + '');uni.setStorageSync('SFACE', res.data.u_face + '');// 跳转if(pageOptions.backtype == 1){uni.redirectTo({url:pageOptions.backpage});}else{uni.switchTab({url:pageOptions.backpage});}}else{uni.showToast({title:res.data});}},fail: (e) => {console.log(JSON.stringify(e));}});},// #endif},onLoad:function(options){_self = this;pageOptions = options;// #ifdef MP-WEIXIN// 调用 微信 login 获取 codeuni.login({success: (res) => {uni.request({url:_self.apiServer+'member&m=codeToSession&code='+res.code,success: (sessions) => {// sessions.date 数据格式// expires_in:7200// openid:"oS6of0V0rdp9nY_BuvCnQUasOHYc"// session_key:"87sE2oDD8lc+aDJj0tB6+g=="// 获取 unionIdsession_key = sessions.data.session_key;openid = sessions.data.openid;},});}});}
}

客户端先调用uni.login获取,微信平台服务器返回的code、session_key,再向本站服务器访问提交code、session_key,后端拿到这些值进行向微信服务器接口请求带参数

$url = "https://api.weixin.qq.com/sns/jscode2session?appid=" + APP_ID + "&secret=" + APP_SERECT +"&js_code=" + ctx.request.body['code'] +"&grant_type=authorization_code";
//Get方式 发送请求 返回数据 数据包含OpenId
$weixin = request($url)
ctx.body = {$weixin
}

后端返回OpenId后,当前端点击登入按钮,触发微信的getUserInfo事件(微信只能通过按钮实现),再用获取到的OpenId去完成后面的逻辑


UnionID

(主要是要给钱,注册企业账号)
暂时不想用它,就不搞了,但是其实差不多的:
可以在getUserInFo获取加密信息,将加密数据传给后端,后端通过对于的js解密(官方给出解密函数),解密就能获取
用户信息和VID了


推荐阅读
  • 微信小程序实现类似微博的无限回复功能,内置云开发数据库支持
    本文详细介绍了如何利用微信小程序实现类似于微博的无限回复功能,并充分利用了微信云开发的数据库支持。文中不仅提供了关键代码片段,还包含了完整的页面代码,方便开发者按需使用。此外,HTML页面中包含了一些示例图片,开发者可以根据个人喜好进行替换。文章还将展示详细的数据库结构设计,帮助读者更好地理解和实现这一功能。 ... [详细]
  • 本文详细介绍了 PHP 中对象的生命周期、内存管理和魔术方法的使用,包括对象的自动销毁、析构函数的作用以及各种魔术方法的具体应用场景。 ... [详细]
  • 开机自启动的几种方式
    0x01快速自启动目录快速启动目录自启动方式源于Windows中的一个目录,这个目录一般叫启动或者Startup。位于该目录下的PE文件会在开机后进行自启动 ... [详细]
  • 在处理大规模数据数组时,优化分页组件对于提高页面加载速度和用户体验至关重要。本文探讨了如何通过高效的分页策略,减少数据渲染的负担,提升应用性能。具体方法包括懒加载、虚拟滚动和数据预取等技术,这些技术能够显著降低内存占用和提升响应速度。通过实际案例分析,展示了这些优化措施的有效性和可行性。 ... [详细]
  • 本文介绍了如何利用Shell脚本高效地部署MHA(MySQL High Availability)高可用集群。通过详细的脚本编写和配置示例,展示了自动化部署过程中的关键步骤和注意事项。该方法不仅简化了集群的部署流程,还提高了系统的稳定性和可用性。 ... [详细]
  • 优化后的标题:深入探讨网关安全:将微服务升级为OAuth2资源服务器的最佳实践
    本文深入探讨了如何将微服务升级为OAuth2资源服务器,以订单服务为例,详细介绍了在POM文件中添加 `spring-cloud-starter-oauth2` 依赖,并配置Spring Security以实现对微服务的保护。通过这一过程,不仅增强了系统的安全性,还提高了资源访问的可控性和灵活性。文章还讨论了最佳实践,包括如何配置OAuth2客户端和资源服务器,以及如何处理常见的安全问题和错误。 ... [详细]
  • Android中将独立SO库封装进JAR包并实现SO库的加载与调用
    在Android开发中,将独立的SO库封装进JAR包并实现其加载与调用是一个常见的需求。本文详细介绍了如何将SO库嵌入到JAR包中,并确保在外部应用调用该JAR包时能够正确加载和使用这些SO库。通过这种方式,开发者可以更方便地管理和分发包含原生代码的库文件,提高开发效率和代码复用性。文章还探讨了常见的问题及其解决方案,帮助开发者避免在实际应用中遇到的坑。 ... [详细]
  • 微信平台通过盛派SDK(sdk.weixin.senparc.com)允许服务号和订阅号使用appId和token读取关注用户的个人信息。然而,这一过程需严格遵守隐私保护和数据安全的相关规定,确保用户数据的安全性和隐私性。 ... [详细]
  • 本文详细介绍了Java反射机制的基本概念、获取Class对象的方法、反射的主要功能及其在实际开发中的应用。通过具体示例,帮助读者更好地理解和使用Java反射。 ... [详细]
  • 本文介绍了如何在 Vue 3 组合 API 中正确设置 setup() 函数的 TypeScript 类型,以避免隐式 any 类型的问题。 ... [详细]
  • 解决Only fullscreen opaque activities can request orientation错误的方法
    本文介绍了在使用PictureSelectorLight第三方框架时遇到的Only fullscreen opaque activities can request orientation错误,并提供了一种有效的解决方案。 ... [详细]
  • 本文介绍了一种使用 JavaScript 计算两个日期之间时间差的方法。该方法支持多种时间格式,并能返回秒、分钟、小时和天数等不同精度的时间差。 ... [详细]
  • 在PHP中,高效地分割字符串是一项常见的需求。本文探讨了多种技术,用于在特定字符(如“或”)后进行字符串分割。通过使用正则表达式和内置函数,可以实现更加灵活和高效的字符串处理。例如,可以使用 `preg_split` 函数来实现这一目标,该函数允许指定复杂的分隔符模式,从而提高代码的可读性和性能。此外,文章还介绍了如何优化分割操作以减少内存消耗和提高执行速度。 ... [详细]
  • 在PHP中实现腾讯云接口签名,以完成人脸核身功能的对接与签名配置时,需要注意将文档中的POST请求改为GET请求。具体步骤包括:使用你的`secretKey`生成签名字符串`$srcStr`,格式为`GET faceid.tencentcloudapi.com?`,确保参数正确拼接,避免因请求方法错误导致的签名问题。此外,还需关注API的其他参数要求,确保请求的完整性和安全性。 ... [详细]
  • 在Django中提交表单时遇到值错误问题如何解决?
    在Django项目中,当用户提交包含多个选择目标的表单时,可能会遇到值错误问题。本文将探讨如何通过优化表单处理逻辑和验证机制来有效解决这一问题,确保表单数据的准确性和完整性。 ... [详细]
author-avatar
我木良心c
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有