微信小程序登录态和检验注册过没的app.js写法


Posted in Javascript onMay 22, 2019

0、可参考的官方页面

获取登录凭证:https://developers.weixin.qq.com/miniprogram/dev/api/wx.login.html
检查登录态是否过期: https://developers.weixin.qq.com/miniprogram/dev/api/wx.checkSession.html

备注:你要明白什么是登录态:这里的登录态是微信小程序自己的登录态,我们可以再自己写个登录页面作为自己的登录态,不过为了用户体验良好我直接以微信登录态做为自己的登录态。所以我的整个小程序是直接自动登录的

 注意:微信小程序缓存很容易被清除,所以你必须时刻提防小程序缓存被清除的状态下怎么处理。

备注:我从后台返回来给小程序的对象格式为:

public ResultCode resultCode; // 业务响应码
 public String resultMsg = ""; // 返回信息描述
 public String errCode; // 错误代码
 public String errCodeDes = ""; // 错误描述
 public Object data; // 返回业务数据
  public enum ResultCode {
  SUCCESS, // 业务处理成功
  FAIL; // 业务处理失败
 }

1、流程

(1)调用wx.checkSession检查用户登录态是否过期,如果没有过期就检查用户注册没注册①,如果过期了就去重新执行登录流程②

(2)②的流程为:调用wx.login来获取登录凭证(code),然后把code发给后台,后台调用 auth.code2Session,使用 code 换取 openid 等信息来获取openId , 把openId返回给小程序, 然后把openId放到小程序缓存里面,然后检查用户注册没注册①

(3)①的流程为:先从缓存查该用户注册没注册过(通过检查缓存变量registered存不存在),有就是老用户,没有就去后台通过openId查有没有这个用户,把结果返回给小程序,如果后台有这个用户,说明已经注册过,就把在缓存里加个registered并赋值true。

 (4)然后我们就可以在其他页面通过registered来判断用户注册没注册过,从而跳转进入注册页面或者是主页

2、app.js代码

App({
   globalData: {
    serverHost: 'http://localhost:8080', //服务器域名
   },
   onLaunch: function() {
    var that = this;
    //检查登录态是否过期
    wx.checkSession({
     success() {
      // session_key 未过期,并且在本生命周期一直有效
      console.log("【用户小程序登录态未过期】");
      that.isRegister();
     },
     fail() {
      // session_key 已经失效,需要重新执行登录流程
      that.wxLogin();
     }
    })
   },
   //查看当前用户是否已经注册过
   isRegister: function() {
    var that = this;
    var host = this.globalData.serverHost;
    // (先从缓存查该用户,有就是老用户,没有就后台查有没有这个用户,后台查到有这个用户就放缓存,没有就是新用户)
    wx.getStorage({
     key: 'registered',
     success(res) {
      console.log("【通过缓存查询到该用户是已经注册过的】");
      console.log("【当前用户的openid为:】" + wx.getStorageSync('openid'));
     },
     fail(res) {
      var openid;
      openid = wx.getStorageSync('openid');
      wx.request({
       url: host + '写自己的后台请求检查用户存不存在的URL',
       method: 'POST',
       data: {
        openId: openid,
       },
       header: {
        "Content-Type": "application/x-www-form-urlencoded"
       },
       success: (res) => {
        if (后台返回注册过") {
         if (res.data.data) {
          console.log("【通过后台查询到该用户已经注册过】");
          wx.setStorage({
           key: "registered",
           data: true
          });
         } else {
          console.log("【通过后台查询到该用户还没注册过】");
         }
        }
       }
      })
     },
    })
   },
   //该函数用来登录的
   wxLogin: function() {
    var that = this;
    //设置后台host
    var host = this.globalData.serverHost;
    console.log("【用户重新执行小程序登录流程】");
    wx.login({
     success(res) {
      // 发起网络请求,发送 res.code 到后台换取 openId
      if (res.code) {
       var code = res.code;
       wx.request({
        url: host + '写自己后台用code换取OpenId的请求URL',
        method: 'POST',
        data: {
         code: code,
        },
        header: {
         "Content-Type": "application/x-www-form-urlencoded"
        },
        success: (res) => {
         console.log("【获取用户openid成功】");
         console.log("【从后台获取到用户openid为】" + res.data.data.openid)
         let openId = res.data.data.openid;
         wx.setStorage({
          key: "openid",
          data: res.data.data.openid
         });
         console.log("【用户openid放入缓存成功】");
         that.isRegister();
        }
       })
      }
     }
    })
   },
 },
})

3、java后台怎么通过code获取openId

import net.sf.json.JSONObject;
/**
 * @author niqinhua
 * @date 2019/3/8 9:19
 */
public class WXUtil {
  public static JSONObject getOpenidAndSessionKey(String code) {
    String url = "https://api.weixin.qq.com/sns/jscode2session";
    String param = "appid=写自己的appId&secret=写自己的密钥&js_code=" +
         code + "&grant_type=authorization_code";
    String wxReturnResult = sendGet(url, param);
    JSONObject wxReturnResultObject = JSONObject.fromObject(wxReturnResult);
    return wxReturnResultObject;
  }
 /**
   * 从规范上,建议把这个方法抽出来放到HttpUtil类里面
   * 向指定URL发送GET方法的请求
   * @param url 发送请求的URL
   * @param param 请求参数,请求参数应该是 name1=value1&name2=value2 的形式。
   * @return URL 所代表远程资源的响应结果
   */
  public static String sendGet(String url, String param) {
    String result = "";
    BufferedReader in = null;
    try {
      String urlNameString = url + "?" + param;
      URL realUrl = new URL(urlNameString);
      // 打开和URL之间的连接
      URLConnection connection = realUrl.openConnection();
      // 设置通用的请求属性
      connection.setRequestProperty("accept", "*/*");
      connection.setRequestProperty("connection", "Keep-Alive");
      connection.setRequestProperty("user-agent", "Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1;SV1)");
      // 建立实际的连接
      connection.connect();
      // 定义 BufferedReader输入流来读取URL的响应
      in = new BufferedReader(new InputStreamReader(
          connection.getInputStream()));
      String line;
      while ((line = in.readLine()) != null) {
        result += line;
      }
    } catch (Exception e) {
      System.out.println("【HTTP发送GET请求出现异常】:访问URL:"+url+",错误:"+e.getMessage());
    }
    // 使用finally块来关闭输入流
    finally {
      try {
        if (in != null) {
          in.close();
        }
      } catch (Exception e2) {
        System.out.println("【HTTP请求关闭输入流异常】:访问URL:"+url+",错误:"+e2.getMessage());
      }
    }
    return result;
  }
}

上面只是工具类直接拿就行,真正业务逻辑要自己写,我只给出重点部分

JSONObject wxReturnJson = WXUtil.getOpenidAndSessionKey(code);
if (wxReturnJson.get("errCode")!=null) {
  //log.error("【获取用户的openid】【失败】【传递参数code无效】");
} else {
  //log.info("【获取用户的openid】【成功】【传递参数code无效】");
}

总结

以上所述是小编给大家介绍的微信小程序登录态和检验注册过没的app.js写法,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

Javascript 相关文章推荐
js和php如何获取当前url的内容
Sep 22 Javascript
JS实现字体选色板实例代码
Nov 20 Javascript
jquery获取元素索引值index()示例
Feb 13 Javascript
extjs每个组件要设置唯一的ID否则会出错
Jun 15 Javascript
js实现获取鼠标当前的位置
Dec 14 Javascript
Angular实现的敏感文字自动过滤与提示功能示例
Dec 29 Javascript
JS中原始值和引用值的储存方式示例详解
Mar 23 Javascript
vue实现条件判断动态绑定样式的方法
Sep 29 Javascript
vuejs+element UI点击编辑表格某一行时获取内容填入表单的示例
Oct 31 Javascript
基于Taro的微信小程序模板消息-获取formId功能模块封装实践
Jul 15 Javascript
微信小程序实现分享商品海报功能
Sep 30 Javascript
详解vue 自定义组件使用v-model 及探究其中原理
Oct 11 Javascript
element-ui上传一张图片后隐藏上传按钮功能
May 22 #Javascript
微信小程序非跳转式组件授权登录的方法示例
May 22 #Javascript
小程序rich-text组件如何改变内部img图片样式的方法
May 22 #Javascript
JavaScript中的 new 命令
May 22 #Javascript
element-ui组件中input等的change事件中传递自定义参数
May 22 #Javascript
原生JS实现列表内容自动向上滚动效果
May 22 #Javascript
小程序如何使用分包加载的实现方法
May 22 #Javascript
You might like
一个简单的MySQL数据浏览器
2006/10/09 PHP
windows下PHP_intl.dll正确配置方法(apache2.2+php5.3.5)
2014/01/14 PHP
PHP包含文件函数include、include_once、require、require_once区别总结
2014/04/05 PHP
PHP中文编码小技巧
2014/12/25 PHP
PHP输出两个数字中间有多少个回文数的方法
2015/03/23 PHP
Thinkphp和onethink实现微信支付插件
2016/04/13 PHP
php mysql like 实现多关键词搜索的方法
2016/10/29 PHP
Yii2中hasOne、hasMany及多对多关联查询的用法详解
2017/02/15 PHP
基于jquery的cookie的用法
2011/01/10 Javascript
JavaScript中几种常见排序算法小结
2011/02/22 Javascript
jQuery插件-jRating评分插件源码分析及使用方法
2012/12/28 Javascript
js拦截alert对话框另类应用
2013/01/16 Javascript
JS字符串处理实例代码
2013/08/05 Javascript
Node.js插件的正确编写方式
2014/08/03 Javascript
jQuery实现表格行上下移动和置顶效果
2015/06/05 Javascript
jQuery实现将页面上HTML标签换成另外标签的方法
2015/06/09 Javascript
jQuery+Ajax实现无刷新操作
2016/01/04 Javascript
jQuery计算文本框字数及限制文本框字数的方法
2016/03/01 Javascript
微信小程序 火车票查询实例讲解
2016/10/17 Javascript
javascript中this关键字详解
2016/12/12 Javascript
详解在Vue中使用TypeScript的一些思考(实践)
2018/07/06 Javascript
jQuery实现checkbox全选、反选及删除等操作的方法详解
2019/08/02 jQuery
[00:59]DOTA2背景故事第二期之四大基本法则
2020/07/07 DOTA
python实现监控linux性能及进程消耗性能的方法
2014/07/25 Python
Python创建系统目录的方法
2015/03/11 Python
Python小进度条显示代码
2019/03/05 Python
python如何读取bin文件并下发串口
2019/07/05 Python
Python Pandas数据中对时间的操作
2019/07/30 Python
TensorFlow实现checkpoint文件转换为pb文件
2020/02/10 Python
PyTorch实现重写/改写Dataset并载入Dataloader
2020/07/14 Python
CSS3 重置iphone浏览器按钮input,select等表单元素的默认样式
2014/10/11 HTML / CSS
recorder.js 基于Html5录音功能的实现
2020/05/26 HTML / CSS
Can a struct inherit from another class? (结构体能继承类吗)
2014/07/22 面试题
司机的工作范围及职责
2013/11/13 职场文书
数据员岗位职责
2013/11/19 职场文书
python scrapy简单模拟登录的代码分析
2021/07/21 Python