服务器之家:专注于服务器技术及软件下载分享
分类导航

PHP教程|ASP.NET教程|Java教程|ASP教程|编程技术|正则表达式|C/C++|IOS|C#|Swift|Android|VB|R语言|JavaScript|易语言|vb.net|

服务器之家 - 编程语言 - PHP教程 - php实现微信小程序授权登录功能(实现流程)

php实现微信小程序授权登录功能(实现流程)

2021-09-17 11:28下页、再停留 PHP教程

这篇文章主要介绍了php实现微信小程序授权登录功能,本文通过一段详细的代码给大家讲解的非常详细,需要的朋友参考下

先上图

php实现微信小程序授权登录功能(实现流程)php实现微信小程序授权登录功能(实现流程)php实现微信小程序授权登录功能(实现流程)php实现微信小程序授权登录功能(实现流程)

实现流程:

1、授权登陆按钮和正文信息放到了同一个页面,未授权的时候显示登陆按钮,已授权的时候隐藏登陆按钮,显示正文信息,当然也可以授权和正文分开成两个页面,在授权页面的onload里判断是否已授权,若已授权就直接跳转正文的页面。这里只说授权按钮和正文在同一页面的情况。

2、在onload里先判断是否已授权,如果已授权,就隐藏授权登陆按钮,显示正文信息,如果没有授权,显示授权登陆按钮。

3、前端使用button的open-type="getUserInfo"来操作,点击授权按钮之后,“e”中会携带userInfo,用户的基本信息(和使用wx.getUserInfo接口获取的数据一样,所以我是在"e"里面直接取的,没有调用wx.getUserInfo接口)

4、使用wx.login接口获取登陆凭证code,使用code去后解密换取openid,传输code的时候带上第3步获取的用户信息一块发送给后台解密(也可以不携带,携带的目的是为了验证签名,这样安全一些,不验证也可以)

5、后台解密使用的是“auth.code2Session”接口,解密用到的SDK下载地址

“https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/signature.html”。

5、后台解密之后(后台语言用的是php),会返回openid等敏感信息,就还可以把这些信息存起来了。

6、获取授权成功之后,再隐藏授权登陆按钮,显示正文信息。

7、如果用户点击拒绝授权,提示引导用户再次授权。

注意,要考虑到授权失败的情况

以下是详细代码

wxml

  1. <view wx:if="{{isHide}}">
  2. <view wx:if="{{canIUse}}" >
  3. <view class='header'>
  4. <image src='/images/icon/wx_login.png'></image>
  5. </view>
  6.  
  7. <view class='content'>
  8. <view>申请获取以下权限</view>
  9. <text>获得你的公开信息(昵称,头像等)</text>
  10. </view>
  11.  
  12. <button class='bottom' type='primary' open-type="getUserInfo" lang="zh_CN" bindgetuserinfo="bindGetUserInfo">
  13. 授权登录
  14. </button>
  15. </view>
  16. <view wx:else>请升级微信版本</view>
  17. </view>
  18.  
  19. <view wx:else>
  20. <view>我的首页内容</view>
  21. </view>

wxss

  1. .header {
  2. margin: 90rpx 0 90rpx 50rpx;
  3. border-bottom: 1px solid #ccc;
  4. text-align: center;
  5. width: 650rpx;
  6. height: 300rpx;
  7. line-height: 450rpx;
  8. }
  9. .header image {
  10. width: 200rpx;
  11. height: 200rpx;
  12. }
  13. .content {
  14. margin-left: 50rpx;
  15. margin-bottom: 90rpx;
  16. }
  17. .content text {
  18. display: block;
  19. color: #9d9d9d;
  20. margin-top: 40rpx;
  21. }
  22. .bottom {
  23. border-radius: 80rpx;
  24. margin: 70rpx 50rpx;
  25. font-size: 35rpx;
  26. }

js

  1. // pages/test1/test1.js
  2. var app = getApp();
  3. Page({
  4. /**
  5. * 页面的初始数据
  6. */
  7. data: {
  8. //判断小程序的API,回调,参数,组件等是否在当前版本可用。
  9. canIUse: wx.canIUse('button.open-type.getUserInfo'),
  10. isHide: false
  11. },
  12. /**
  13. * 生命周期函数--监听页面加载
  14. */
  15. onLoad: function (options) {
  16. var that = this;
  17. // 查看是否授权
  18. wx.getSetting({
  19. success: function (res) {
  20. if (!res.authSetting['scope.userInfo']) {
  21. // 还未授权,显示授权按钮
  22. that.setData({
  23. isHide: true
  24. });
  25. } else {
  26. // 已授权,隐藏授权按钮,显示正文
  27. that.setData({
  28. isHide: false
  29. });
  30. }
  31. }
  32. })
  33. },
  34. //授权登陆按钮
  35. bindGetUserInfo: function (e) {
  36. var that = this;
  37. console.log(e)
  38. if (e.detail.userInfo) {
  39. //用户授权登陆,并跳转首页
  40. // that.getOpenid()
  41. wx.login({
  42. success: function (res) {
  43. // 请求自己后台获取用户openid
  44. wx.request({
  45. url: app.domain + 'teacherapi/Wx_Decode/WxDecode',
  46. method: 'POST',
  47. header: { 'content-type': 'application/x-www-form-urlencoded' },
  48. data: {
  49. encryptedData: e.detail.encryptedData,
  50. signature: e.detail.signature,
  51. rawData: e.detail.rawData,
  52. iv: e.detail.iv,
  53. code: res.code
  54. },
  55. success: function (res_user) {
  56. if (res_user.data.status == 0) {
  57. var data = JSON.parse(res_user.data.msg)    //json转对象
  58. //授权成功返回的数据,根据自己需求操作
  59. console.log(data)
  60. //授权成功后,隐藏授权按钮,显示正文
  61. that.setData({
  62. isHide: false
  63. });
  64. }
  65. }, fail: function () {
  66. that.showModal('获取授权信息失败')
  67. }
  68. })
  69. }
  70. })
  71. } else {
  72. //用户按了拒绝授权按钮,提示引导授权
  73. that.showModal('请授权后使用小程序')
  74. }
  75. },
  76. //未授权弹窗
  77. showModal: function (e) {
  78. wx.showModal({
  79. title: '提示',
  80. content: e,
  81. showCancel: false,
  82. confirmText: '返回授权',
  83. success: function (res) {
  84. if (res.confirm) {
  85. console.log('用户点击了“返回授权”')
  86. }
  87. }
  88. })
  89. },
  90. })

php

  1. <?php
  2. namespace app\teacherapi\controller;
  3. use think\Controller;
  4. /**
  5. * @date: 2018-12
  6. * 微信操作类
  7. */
  8. class WxDecode extends Controller
  9. {
  10. public function httpGet($url) {
  11. $curl = curl_init();
  12. curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
  13. curl_setopt($curl, CURLOPT_TIMEOUT, 500);
  14. curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false);
  15. curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, false);
  16. curl_setopt($curl, CURLOPT_URL, $url);
  17. $res = curl_exec($curl);
  18. curl_close($curl);
  19. return $res;
  20. }
  21. /**
  22. * @author: zxf
  23. * @date: 2018-12-08
  24. * @description: 解密微信用户敏感数据
  25. * @return array
  26. */
  27. public function WxDecode()
  28. {
  29. // 接收参数
  30. $data = request() -> param();
  31. // 引入解密文件 在微信小程序开发文档下载
  32. vendor('wx.WXBizDataCrypt');
  33. vendor('wx.ErrorCode');
  34. $appid = config('TESTPPID');
  35. $appsecret = config('TESTSECREET');
  36. $grant_type = "authorization_code"; //授权(必填)
  37. $code = $data['code']; //有效期5分钟 登录会话
  38. $encryptedData=$data['encryptedData'];
  39. $iv = $data['iv'];
  40. $signature = $data['signature'];
  41. $rawData = $data['rawData'];
  42. // 拼接url
  43. $url = "https://api.weixin.qq.com/sns/jscode2session?"."appid=".$appid."&secret=".$appsecret."&js_code=".$code."&grant_type=".$grant_type;
  44. $res = json_decode($this->httpGet($url),true);
  45. $sessionKey = $res['session_key']; //取出json里对应的值
  46. $signature2 = sha1(htmlspecialchars_decode($rawData).$sessionKey);
  47. // 验证签名
  48. if ($signature2 !== $signature){
  49. return json("验签失败");
  50. }
  51. // 获取解密后的数据
  52. $pc = new \WXBizDataCrypt($appid, $sessionKey);
  53. $errCode = $pc->decryptData($encryptedData, $iv, $data );
  54. if ($errCode == 0) {
  55. return return_succ($data);
  56. } else {
  57. return return_error($errCode);
  58. }
  59. }
  60. }

原文链接:https://www.cnblogs.com/zxf100/archive/2019/11/13/11849878.html

延伸 · 阅读

精彩推荐