微信小程序登录态和检验注册过没的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 相关文章推荐
JavaScript 撑出页面文字换行
Jun 15 Javascript
JS清除IE浏览器缓存的方法
Jul 26 Javascript
jQuery动态显示和隐藏datagrid中的某一列的方法
Dec 11 Javascript
一个JavaScript函数把URL参数解析成Json对象
Sep 24 Javascript
JavaScript中模拟实现jsonp
Jun 19 Javascript
jQuery mobile的header和footer在点击屏幕的时候消失的解决办法
Jul 01 Javascript
避免jQuery名字冲突 noConflict()方法
Jul 30 Javascript
React.js中常用的ES6写法总结(推荐)
May 09 Javascript
three.js中文文档学习之通过模块导入
Nov 20 Javascript
Vue实现简单分页器
Dec 29 Javascript
详解写好JS条件语句的5条守则
Feb 28 Javascript
vue实现移动端div拖动效果
Mar 03 Vue.js
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
php下通过POST还是GET来传值
2008/06/05 PHP
php下实现一个阿拉伯数字转中文数字的函数
2008/07/10 PHP
php二分法在IP地址查询中的应用
2008/08/12 PHP
JS中剪贴板兼容性、判断复制成功或失败
2021/03/09 Javascript
Aster vs KG BO3 第二场2.19
2021/03/10 DOTA
图片格式的JavaScript和CSS速查手册
2007/08/20 Javascript
jquery tools系列 expose 学习
2009/09/06 Javascript
JS面向对象编程浅析
2011/08/28 Javascript
web开发人员学习jQuery的6大理由及jQuery的优势介绍
2013/01/03 Javascript
JavaScript实现重置表单(reset)的方法
2015/04/02 Javascript
JavaScript中String.match()方法的使用详解
2015/06/06 Javascript
微信小程序-图片、录音、音频播放、音乐播放、视频、文件代码实例
2016/11/22 Javascript
从零学习node.js之利用express搭建简易论坛(七)
2017/02/25 Javascript
Bootstrap Table使用整理(三)
2017/06/09 Javascript
vue下跨域设置的相关介绍
2017/08/26 Javascript
Vue路由history模式解决404问题的几种方法
2018/09/29 Javascript
基于Node.js的大文件分片上传示例
2019/06/19 Javascript
Node.js爬虫如何获取天气和每日问候详解
2019/08/26 Javascript
JavaScript React如何修改默认端口号方法详解
2020/07/28 Javascript
Vuex实现简单购物车
2021/01/10 Vue.js
[03:12]完美世界DOTA2联赛PWL DAY9集锦
2020/11/10 DOTA
Python实现动态加载模块、类、函数的方法分析
2017/07/18 Python
Python实现图片滑动式验证识别方法
2017/11/09 Python
pytorch加载语音类自定义数据集的方法教程
2020/11/10 Python
世界上最大的在线旅行社新加坡网站:Expedia新加坡
2016/08/25 全球购物
State Cashmere官网:半零售价可持续蒙古羊绒
2020/02/26 全球购物
为什么要优先使用同步代码块而不是同步方法?
2013/01/30 面试题
自我介绍演讲稿
2014/01/15 职场文书
党支部书记岗位责任制
2014/02/11 职场文书
幼儿园爱国卫生月活动总结
2014/06/30 职场文书
党员个人对照检查材料范文
2014/09/24 职场文书
劳动仲裁撤诉申请书
2015/05/18 职场文书
九九重阳节致辞
2015/07/31 职场文书
2016优秀班主任个人先进事迹材料
2016/02/26 职场文书
SQL实现LeetCode(176.第二高薪水)
2021/08/04 MySQL
python数字图像处理之对比度与亮度调整示例
2022/06/28 Python