微信小程序登录换取token的教程


Posted in Javascript onMay 31, 2018

前言:

这次主要是介绍些业务逻辑,技术点倒是没有多少。不过在开发中,优秀的编程思路同样是非常值得学习的。

最近小程序可以说在开发届狠狠的火了一把。微信小程序可以开发游戏,腾讯率先带头,做出了一个跳一跳也是点爆朋友圈。所谓落后就要挨打,那么今天就开始学习小程序的一些小知识吧(本文基于十年磨一剑的tp5)

目录:

  1. 微信登录换取token的流程
  2. 如何将code变成openid和session_key
  3. 抛出错误异常和派发令牌

一:微信登录换取token的流程

多说无益,直接上图

微信小程序登录换取token的教程

小程序获取token.png

这里介绍的主要是后端开发的流程,前端的不是本文介绍的重点

二:如何将code变成openid和session_key

我们后端开发人员对这个业务是从接受code开始的,由客户端发来一个code码。

我们接受后先进行验证

//创建独立验证器,调用验证器中的验证方法
TokenCheck::instance()->goCheck();

如果不是很清楚验证器的用法的朋友 可以先看看我之前写的验证器的使用

验证规则很简单,就是判断不为空就可以了

下一步就是我们需要把code换取openid 和session_key了

首先我们需要在创建一个service层的类,(为什么要使用service层呢?主要是我为了让模型层粒度细一些。业务比较复杂的就放在service层。这样比较利于后期修改和升级)

class UserToken extends Token
{
  protected $wxAppId;
  protected $wxAppSecret;
  protected $wxLoginUrl;

  //构造函数中赋值成员变量
  public function __construct($code)
  {
    $this->wxAppId = config('wx.app_id');
    $this->wxAppSecret = config('wx.app_secret');
    $this->wxLoginUrl = sprintf(config('wx.login_url'), $this->wxAppId, $this->wxAppSecret, $code);
  }
}

写一个构造函数,让在对象生成的时候就赋值成员变量方便使用,这里的appid和appsecret 都是在微信申请小程序的时候就有了的。这里就不介绍了。之前我是把他们全部存在我的配置文件的。使用tp5提供的config函数将他们提出来。最后使用 sprintf方法,将这些参数拼接到wxLoginUrl中,方便我们访问。

熟悉Oauth2.0的朋友都知道,拿到这个url其实就是微信的一个接口,我们去换取授权。

下面我们创建一个getUserToken方法

/**
   * 获取用户的令牌方法
   * @throws Exception
   */
  public function getUserToken()
  {
    //调用公共函数中的http方法(也就是curl的方法,我也是在网上抄的。存放在common.php中就可以直接用了)
    $result = http($this->wxLoginUrl, 'post');
    //判断连接是否成功
    if ($result[0] == 200) {
      //将返回的json处理成数组
      $wxResult = json_decode($result[1], true);
      //判空
      if (empty($wxResult)) {
        throw new Exception('获取session_key,openID时异常,微信内部错误');
      } else {
         //判断返回的结果中是否有错误码
        if (isset($wxResult['errcode'])) {
          //如果有错误码,调用抛出错误方法
          $this->_throwWxError($wxResult);
        } else {
          //没有错误码,调用私有的派发token方法
          $token = $this->_grantToken($wxResult);
          return $token;
        }
      }
    } else {
      throw new Exception('连接微信服务器失败');
    }
  }

写好了,方法之后,只需要在控制器中调用这个getUserToken方法就可以了。

大家可能会问,那个_throwWxError和_grantToken方法是干什么的?

可能大家也看出来了,这个getUserToken方法中我们一个获取到了微信返回的结果,也就是$wxResult变量中的数据。如果不出别的意外那么,里面就有我们需要的openid和session_key。这不过,介绍到这里,我们还没有开始使用他们

三:抛出错误异常和派发令牌

这里两个其实就是两个方法,重点是派发令牌。这里的抛出异常。我准备单独写一次介绍。

/**
   * 微信获取open_id失败,抛出异常方法
   * @param $wxResult
   * @throws WxException
   */
  private function _throwWxError($wxResult)
  {
    throw new WxException(
      [
        'message' => $wxResult['errmsg'],
        'errorCode' => $wxResult['errcode']
      ]
    );
  }

我们来看_grantToken方法

我们将微信返回给我们的数据,转换为数组后,保存到$wxResult中,在调用派发令牌方法时,直接传入。

下面的代码中有个User类调用的getUidByOpenId方法,这里是User模型上封装的一个查询方法,就是看User表中是否有这个openid,如果有返回uid

如果数据库中没有uid的话,说明是新用户,则在数据库中插入一条数据,返回新插入的主键 id

/**
   * 派发User 令牌
   * @param $wxResult
   * @return string
   * @throws Exception
   */
  private function _grantToken($wxResult)
  {
    //拿到open_id
    $openId = $wxResult['openid'];
    //判断open_id是否存在
    $id = User::getUidByOpenId($openId);
    //如果数据库中不存在
    if (!$id) {
      //添加一条记录,返回新创建的id
      $id = User::createUser($openId);
      if (!$id) {
        throw new Exception('新增一条User失败');
      }
    }
    //拼接数据为一个数组。(这个方法就是将wxResult中的openid和session_key取出,然后和用户id一起放进一个数组)
    $tokenValue = $this->_splicingValue($wxResult, $id);
    //制作令牌
    //存入缓存
    $token = $this->_saveCache($tokenValue);
    //返回token
    return $token;
  }

下面我们来看看_saveCache方法

我们将拼接成一个数组的数据$tokenValue直接传入方法中,调用一个随机字符串方法,将这个随机字符串当做key,把传入我用户数据序列化之后当作value,然后根据配置里的缓存过期时间,来存入缓存。

/**
   * 将令牌存入缓存,返回token
   * @param $tokenValue
   * @return string
   * @throws TokenException
   */
  private function _saveCache($tokenValue)
  {
    //调用父类中的随机字符串方法
    $key = parent::_makeToken();
    //序列化包含id,openid,sessionKey的数组
    $value = serialize($tokenValue);
    //在配置中取出保存时间的配置
    $expriesTime = config('setting.expires_in');
    //存入缓存
    $result = cache($key, $value, $expriesTime);
    //如果存入失败,抛出异常
    if (!$result) {
      throw new TokenException(
        ['errorCode' => 10003, 'message' => 'Token save fail']
      );
    }
    //返回随机字符串(也就是要返回给客户端的token)
    return $key;
  }

随机字符方法,为了提高token的安全性,让别人不那么容易的复制我们的token。我就写了这样的一个方法,大家如果有安全性更好的方法也可以使用自己想的。我就不介绍了 看代码吧

/**
   * 构建token随机字符串
   */
  public function _makeToken()
  {
    //随机抽取32位字符串方法,保存在common.php中
    $randChar = randomkeys(32);
    //时间戳
    $timestamp = time();
    //配置中的盐值
    $salt = config('secret.token_salt');
    //拼接之后sha1加密
    return sha1($randChar . $timestamp . $salt);
  }

这里我们就将随机生成的随机字符串返回到service层,service层再返回给控制器,控制器就可以返回给客户端了

看下完整的控制器吧

public function getToken($code = '')
  {
    //创建独立验证器,调用验证器中的验证方法
    TokenCheck::instance()->goCheck();
    $utObj = new UserToken($code);
    $token = $utObj->getUserToken();
    return ['token'=>$token];
  }

这样一个小程序登录换取token的流程就走完了。这个业务呢是借助微信服务器中的openid来作为唯一标识来派发token,如果不是微信的项目的话,我们同样的可以是微博登录,qq登录等第三方登录。或者自己的数据库中的id来作为唯一标识。同样可以派发token。

这里只是介绍了token的派发,还有一些token的应用,有时间的时候再写吧。今天就介绍到这里。如果有什么没有写对的地方,希望大神指正,我们共同学习。

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

Javascript 相关文章推荐
浅析Node在构建超媒体API中的作用
Jul 30 Javascript
JavaScript中的类(Class)详细介绍
Dec 30 Javascript
javascript基本包装类型介绍
Apr 10 Javascript
JavaScript SHA512&SHA256加密算法详解
Aug 11 Javascript
JS实现直接运行html代码的方法
Mar 13 Javascript
20行js代码实现的贪吃蛇小游戏
Jun 20 Javascript
Vue项目全局配置页面缓存之按需读取缓存的实现详解
Aug 01 Javascript
element ui table 增加筛选的方法示例
Nov 02 Javascript
vue-cli2 构建速度优化的实现方法
Jan 08 Javascript
vue框架下部署上线后刷新报404问题的解决方案(推荐)
Apr 03 Javascript
bootstrap table实现iview固定列的效果实例代码详解
Sep 30 Javascript
小程序采集录音并上传到后台
Nov 22 Javascript
Rollup处理并打包JS文件项目实例代码
May 31 #Javascript
手把手教你vue-cli单页到多页应用的方法
May 31 #Javascript
详解基于Node.js的HTTP/2 Server实践
May 31 #Javascript
jQuery基于Ajax实现读取XML数据功能示例
May 31 #jQuery
jQuery实现动态加载select下拉列表项功能示例
May 31 #jQuery
vuejs实现标签选项卡动态更改css样式的方法
May 31 #Javascript
Vue组件之极简的地址选择器的实现
May 31 #Javascript
You might like
php传值赋值和传地址赋值用法实例分析
2015/06/20 PHP
PHP+Redis链表解决高并发下商品超卖问题(实现原理及步骤)
2020/08/03 PHP
从盛大通行证上摘下来的身份证验证js代码
2011/01/11 Javascript
深入理解JavaScript系列(12) 变量对象(Variable Object)
2012/01/16 Javascript
js中的onchange和onpropertychange (onchange无效的解决方法)
2014/03/08 Javascript
基于jquery的手风琴图片展示效果实现方法
2014/12/16 Javascript
js实现图片轮播效果
2015/12/19 Javascript
基于javascript实现图片切换效果
2016/04/17 Javascript
jQuery插件FusionCharts实现的2D饼状图效果【附demo源码下载】
2017/03/03 Javascript
Angular 4依赖注入学习教程之组件服务注入(二)
2017/06/04 Javascript
JavaScript 程序错误Cannot use 'in' operator to search的解决方法
2017/07/10 Javascript
Vue2.0权限树组件实现代码
2017/08/29 Javascript
javascript按钮禁用和启用的效果实例代码
2017/10/29 Javascript
Vue多系统切换实现方案
2018/06/05 Javascript
vue.js添加一些触摸事件以及安装fastclick的实例
2018/08/28 Javascript
VUE v-for循环中每个item节点动态绑定不同函数的实例
2018/09/26 Javascript
jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例
2019/05/27 jQuery
微信小程序官方动态自定义底部tabBar的例子
2019/09/04 Javascript
layer.confirm()右边按钮实现href的例子
2019/09/27 Javascript
[13:21]DOTA2国际邀请赛采访专栏:RSnake战队国士无双,Fnatic.Fly
2013/08/06 DOTA
python连接池实现示例程序
2013/11/26 Python
python将文本分每两行一组并保存到文件
2018/03/19 Python
python os用法总结
2018/06/08 Python
Python基于OpenCV实现人脸检测并保存
2019/07/23 Python
python同时替换多个字符串方法示例
2019/09/17 Python
Python3的unicode编码转换成中文的问题及解决方案
2019/12/10 Python
Python类中的装饰器在当前类中的声明与调用详解
2020/04/15 Python
Python LMDB库的使用示例
2021/02/14 Python
新百伦折扣店:Joe’s New Balance Outlet
2016/08/20 全球购物
英国鞋网:Rubber Sole
2020/03/03 全球购物
什么是Linux虚拟文件系统VFS
2012/01/31 面试题
日语翻译个人求职的自我评价
2013/10/14 职场文书
文秘专业个人求职信
2013/12/22 职场文书
2014年幼儿园元旦活动方案
2014/02/13 职场文书
如何拟写通知正文?
2019/04/02 职场文书
你真的了解PHP中的引用符号(&)吗
2021/05/12 PHP