微信小程序登录换取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 相关文章推荐
浅析JS运动
Dec 28 Javascript
基于HTML模板和JSON数据的JavaScript交互(移动端)
Apr 06 Javascript
jQuery 操作input中radio的技巧
Jul 18 Javascript
jQuery的extend方法【三种】
Dec 14 Javascript
谈谈JS中的!!
Dec 07 Javascript
解决angularjs service中依赖注入$scope报错的问题
Oct 02 Javascript
vue基础之v-bind属性、class和style用法分析
Mar 11 Javascript
vue+vuex+json-seiver实现数据展示+分页功能
Apr 11 Javascript
layer.open回调获取弹出层参数的实现方法
Sep 10 Javascript
vue中注册自定义的全局js方法
Nov 15 Javascript
Node Mongoose用法详解【Mongoose使用、Schema、对象、model文档等】
May 13 Javascript
js实现无刷新监听URL的变化示例代码详解
Jun 03 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中文件下载功能实现超详细流程分析
2012/06/13 PHP
php实现自动获取生成文章主题关键词功能的深入分析
2013/06/03 PHP
PHP判断密码强度的方法详解
2017/05/26 PHP
JavaScript中数组的排序、乱序和搜索实现代码
2011/11/30 Javascript
javascript 原型链维护和继承详解
2014/11/26 Javascript
jquery制作属于自己的select自定义样式
2015/11/23 Javascript
拖动时防止选中
2017/02/03 Javascript
JS+canvas绘制的动态机械表动画效果
2017/09/12 Javascript
JavaScript Date对象应用实例分享
2017/10/30 Javascript
jquery如何实现点击空白处隐藏元素
2017/12/05 jQuery
利用JS判断客户端类型你应该知道的四种方法
2017/12/22 Javascript
Vue中v-for的数据分组实例
2018/03/07 Javascript
vue点击input弹出带搜索键盘并监听该元素的方法
2018/08/25 Javascript
微信头像地址失效踩坑记附带解决方案
2019/09/23 Javascript
小程序跳转H5页面的方法步骤
2020/03/06 Javascript
jQuery 动态粒子效果示例代码
2020/07/07 jQuery
详解React中共享组件逻辑的三种方式
2021/02/02 Javascript
Python使用random和tertools模块解一些经典概率问题
2015/01/28 Python
在Python中使用lambda高效操作列表的教程
2015/04/24 Python
python抓取百度首页的方法
2015/05/19 Python
Python正则表达式常用函数总结
2017/06/24 Python
详解Python nose单元测试框架的安装与使用
2017/12/20 Python
Python3多线程爬虫实例讲解代码
2018/01/05 Python
python 实现在Excel末尾增加新行
2018/05/02 Python
详解关于Django中ORM数据库迁移的配置
2018/10/08 Python
opencv与numpy的图像基本操作
2019/03/08 Python
详解Django项目中模板标签及模板的继承与引用(网站中快速布置广告)
2019/03/27 Python
python matplotlib中的subplot函数使用详解
2020/01/19 Python
英国家庭、花园、汽车和移动解决方案:Easylife Group
2018/05/23 全球购物
大学自主招生推荐信
2014/05/10 职场文书
厕所文明标语
2014/06/11 职场文书
学校与家长安全责任书
2014/07/23 职场文书
保留意见审计报告
2015/06/05 职场文书
中学总务处工作总结
2015/08/12 职场文书
一文带你理解vue创建一个后台管理系统流程(Vue+Element)
2021/05/18 Vue.js
springboot用户数据修改的详细实现
2022/04/06 Java/Android