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


Posted in PHP onNovember 13, 2019

先上图

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

<view wx:if="{{isHide}}">
  <view wx:if="{{canIUse}}" >
    <view class='header'>
      <image src='/images/icon/wx_login.png'></image>
    </view>
 
    <view class='content'>
      <view>申请获取以下权限</view>
      <text>获得你的公开信息(昵称,头像等)</text>
    </view>
 
    <button class='bottom' type='primary' open-type="getUserInfo" lang="zh_CN" bindgetuserinfo="bindGetUserInfo">
      授权登录
    </button>
  </view>
  <view wx:else>请升级微信版本</view>
</view>
 
<view wx:else>
  <view>我的首页内容</view>
</view>

wxss

.header {
  margin: 90rpx 0 90rpx 50rpx;
  border-bottom: 1px solid #ccc;
  text-align: center;
  width: 650rpx;
  height: 300rpx;
  line-height: 450rpx;
}
.header image {
  width: 200rpx;
  height: 200rpx;
}
.content {
  margin-left: 50rpx;
  margin-bottom: 90rpx;
}
.content text {
  display: block;
  color: #9d9d9d;
  margin-top: 40rpx;
}
.bottom {
  border-radius: 80rpx;
  margin: 70rpx 50rpx;
  font-size: 35rpx;
}

js

// pages/test1/test1.js
var app = getApp();
Page({
 /**
  * 页面的初始数据
  */
 data: {
  //判断小程序的API,回调,参数,组件等是否在当前版本可用。
  canIUse: wx.canIUse('button.open-type.getUserInfo'),
  isHide: false
 },
 /**
  * 生命周期函数--监听页面加载
  */
 onLoad: function (options) {
  var that = this;
  // 查看是否授权
  wx.getSetting({
   success: function (res) {
    if (!res.authSetting['scope.userInfo']) {
     // 还未授权,显示授权按钮
     that.setData({
      isHide: true
     });
    } else {
     // 已授权,隐藏授权按钮,显示正文
     that.setData({
      isHide: false
     });
    }
   }
  })
 },
 //授权登陆按钮
 bindGetUserInfo: function (e) {
  var that = this;
  console.log(e)
  if (e.detail.userInfo) {
   //用户授权登陆,并跳转首页
   // that.getOpenid()
   wx.login({
    success: function (res) {
     // 请求自己后台获取用户openid
     wx.request({
      url: app.domain + 'teacherapi/Wx_Decode/WxDecode',
      method: 'POST',
      header: { 'content-type': 'application/x-www-form-urlencoded' },
      data: {
       encryptedData: e.detail.encryptedData,
       signature: e.detail.signature,
       rawData: e.detail.rawData,
       iv: e.detail.iv,
       code: res.code
      },
      success: function (res_user) {
       if (res_user.data.status == 0) {
        var data = JSON.parse(res_user.data.msg)//json转对象
        //授权成功返回的数据,根据自己需求操作
        console.log(data)
        //授权成功后,隐藏授权按钮,显示正文
        that.setData({
         isHide: false
        });
       }
      }, fail: function () {
       that.showModal('获取授权信息失败')
      }
     })
    }
   })
  } else {
   //用户按了拒绝授权按钮,提示引导授权
   that.showModal('请授权后使用小程序')
  }
 },
 //未授权弹窗
 showModal: function (e) {
  wx.showModal({
   title: '提示',
   content: e,
   showCancel: false,
   confirmText: '返回授权',
   success: function (res) {
    if (res.confirm) {
     console.log('用户点击了“返回授权”')
    }
   }
  })
 },
})

php

<?php
namespace app\teacherapi\controller;
use think\Controller;
/**
* @date: 2018-12
* 微信操作类
*/
class WxDecode extends Controller
{
  public function httpGet($url) {
    $curl = curl_init();
    curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
    curl_setopt($curl, CURLOPT_TIMEOUT, 500);
    curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false);
    curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, false);
    curl_setopt($curl, CURLOPT_URL, $url);
    $res = curl_exec($curl);
    curl_close($curl);
    return $res;
  }
  /**
   * @author: zxf
   * @date: 2018-12-08
   * @description: 解密微信用户敏感数据
   * @return array
   */
  public function WxDecode()
  {
    // 接收参数
    $data = request() -> param();
    // 引入解密文件 在微信小程序开发文档下载
    vendor('wx.WXBizDataCrypt');
    vendor('wx.ErrorCode');
    $appid = config('TESTPPID');
    $appsecret = config('TESTSECREET');
    $grant_type = "authorization_code"; //授权(必填)
    $code = $data['code'];    //有效期5分钟 登录会话
    $encryptedData=$data['encryptedData'];
    $iv = $data['iv'];
    $signature = $data['signature'];
    $rawData = $data['rawData'];
    // 拼接url
    $url = "https://api.weixin.qq.com/sns/jscode2session?"."appid=".$appid."&secret=".$appsecret."&js_code=".$code."&grant_type=".$grant_type;
    $res = json_decode($this->httpGet($url),true);
    $sessionKey = $res['session_key']; //取出json里对应的值
    $signature2 = sha1(htmlspecialchars_decode($rawData).$sessionKey);
    // 验证签名
    if ($signature2 !== $signature){
      return json("验签失败");
    } 
    // 获取解密后的数据
    $pc = new \WXBizDataCrypt($appid, $sessionKey);
    $errCode = $pc->decryptData($encryptedData, $iv, $data );
    if ($errCode == 0) {
      return return_succ($data);
    } else {
      return return_error($errCode);
    }
  }
}
PHP 相关文章推荐
php数组去重的函数代码
Feb 03 PHP
destoon各类调用汇总
Jun 20 PHP
简单实用的网站PHP缓存类实例
Jul 18 PHP
PHP获取当前日期和时间及格式化方法参数
May 11 PHP
PHP根据图片色界在不同位置加水印的方法
Jul 01 PHP
php提高网站效率的技巧
Sep 29 PHP
YII动态模型(动态表名)支持分析
Mar 29 PHP
浅谈PHP Cookie处理函数
Jun 10 PHP
PHP中抽象类,接口功能、定义方法示例
Feb 26 PHP
laravel 实现登陆后返回登陆前的页面方法
Oct 03 PHP
Laravel-添加后台模板AdminLte的实现方法
Oct 08 PHP
PHP中strval()函数实例用法
Jun 07 PHP
php 命名空间(namespace)原理与用法实例小结
Nov 13 #PHP
在 PHP 和 Laravel 中使用 Traits的方法
Nov 13 #PHP
php 多个变量指向同一个引用($b = &amp;$a)用法分析
Nov 13 #PHP
php 自定义函数实现将数据 以excel 表格形式导出示例
Nov 13 #PHP
php array 转json及java 转换 json数据格式操作示例
Nov 13 #PHP
Yii框架学习笔记之应用组件操作示例
Nov 13 #PHP
Yii框架自定义数据库操作组件示例
Nov 11 #PHP
You might like
简单了解将WordPress中的工具栏移到底部的小技巧
2015/12/31 PHP
Django 标签筛选的实现代码(一对多、多对多)
2018/09/05 PHP
laravel 数据验证规则详解
2019/10/23 PHP
用jquery实现下拉菜单效果的代码
2010/07/25 Javascript
javascript闭包的理解和实例
2010/08/12 Javascript
JavaScript高级程序设计(第3版)学习笔记13 ECMAScript5新特性
2012/10/11 Javascript
JavaScript实现16进制颜色值转RGB的方法
2015/02/09 Javascript
深入分析Javascript跨域问题
2015/04/17 Javascript
Javascript的比较汇总
2016/07/25 Javascript
jQuery实现链接的title快速出现的方法
2017/02/20 Javascript
Vue.js组件通信的几种姿势
2017/10/23 Javascript
微信小程序基于本地缓存实现点赞功能的方法
2017/12/18 Javascript
JavaScript实现写入文件到本地的方法【基于FileSaver.js插件】
2018/03/15 Javascript
Vue数据监听方法watch的使用
2018/03/28 Javascript
对类Vue的MVVM前端库的实现代码
2018/09/07 Javascript
vue + element-ui的分页问题实现
2018/12/17 Javascript
小程序实现左右来回滚动字幕效果
2018/12/28 Javascript
JS隐藏号码中间4位代码实例
2019/04/09 Javascript
js实现轮播图特效
2020/05/28 Javascript
[00:35]DOTA2上海特级锦标赛 VP战队宣传片
2016/03/04 DOTA
Python实现抓取城市的PM2.5浓度和排名
2015/03/19 Python
Python实现将绝对URL替换成相对URL的方法
2015/06/28 Python
python regex库实例用法总结
2021/01/03 Python
基于canvas的骨骼动画的示例代码
2018/06/12 HTML / CSS
美体小铺英国官网:The Body Shop英国
2017/01/24 全球购物
惠普加拿大在线商店:HP加拿大
2017/09/15 全球购物
2013年学期结束动员演讲稿
2014/01/07 职场文书
《黄河颂》教学反思
2014/02/07 职场文书
小学安全教育材料
2014/02/17 职场文书
党员公开承诺书和承诺事项
2014/03/25 职场文书
工作推荐信范文
2014/05/10 职场文书
啤酒节策划方案
2014/05/28 职场文书
第一批党的群众路线教育实践活动总结报告
2014/07/03 职场文书
教师“一帮一”结对子活动总结
2015/05/07 职场文书
MySQL infobright的安装步骤
2021/04/07 MySQL
解决Go gorm踩过的坑
2021/04/30 Golang