微信小程序如何获取用户信息


Posted in Javascript onJanuary 26, 2018

最近在研究微信小程序怎么玩的。接触后发现好多的坑。

比如在浏览器中我们可以通过document.getElementById 获取到页面的DOM对象。而在微信小程序中是获取不到DOM对象的。document.getElementById() 直接报错 getElementById not function 我也是醉了。不支持这个好多有趣的功能不能实现了。
言归正传,我谈下获取用户信息的感想。

有两种获取用户信息的方案。
1、不包含敏感信息openId 的json对象(包含:nickname、avatarUrl等基本信息)
2、包含敏感信息openId的基本信息。

第一种获取方案

1、首先调用wx.login()接口 让用户授权验证,也就是我们肉眼观察到的,你是否对xxxxx授权这种信息。
2、用户成功授权后,调用wx.getUserInfo() 接口获取用户信息。

完整代码如下

wx.login({
 success:function(){
 wx.getUserInfo({
  success:function(res){
  var simpleUser = res.userInfo;
  console.log(simpleUser.nickName);
  }
 });
 }
});

第二种比较复杂了,需要与后台进行交互才能获得userInfo,但是这种方案获得的数据是完整的(包含openId)。

1、调用wx.login()接口 授权 在success 成功函数的参数中包含code。
2、调用wx.getUserInfo()接口success 函数中包含encryptedData、iv
3、将上述参数传给后台解析,生成userInfo

代码如下
js

var request = require("../../utils/request.js");

wx.login({
 success:function(res_login){
  if(res_login.code)
  {
  wx.getUserInfo({
   withCredentials:true,
   success:function(res_user){
   var requestUrl = "/getUserApi/xxx.php";
   var jsonData = {
    code:res_login.code,
    encryptedData:res_user.encryptedData,
    iv:res_user.iv
    };
   request.httpsPostRequest(requestUrl,jsonData,function(res){
   console.log(res.openId);
   });
   }
  })
  }
 }
 })

后台解析

/**
 * 获取粉丝信息
 * 其中的参数就是前端传递过来的
 */
public function wxUserInfo($code,$encryptedData,$iv)
{
 $apiUrl = "https://api.weixin.qq.com/sns/jscode2session?appid={$this->wxConfig['appid']}&secret={$this->wxConfig['appsecret']}&js_code={$code}&grant_type=authorization_code";

 $apiData = json_decode(curlHttp($apiUrl,true),true);

 if(!isset($apiData['session_key']))
 {
 echoJson(array(
  "code" => 102,
  "msg" => "curl error"
 ),true);
 }

 $userInfo = getUserInfo($this->wxConfig['appid'],$apiData['session_key'],$encryptedData,$iv);

 if(!$userInfo)
 {
 echoJson(array(
  "code" => 105,
  "msg" => "userInfo not"
 ));
 }

 //$userInfo = json_decode($userInfo,true);

 //载入用户服务
 //$userService = load_service("User");

 //$userService->checkUser($this->projectId,$userInfo);

 echo $userInfo; //微信响应的就是一个json数据
}

getUserInfo function 其中wxBizDataCrypt.php 就是微信官方提供的素材包

curlHttp 函数是一个自定函数 该函数的源码查看我的这篇文章curlHttp

//获取粉丝信息
function getUserInfo($appid,$sessionKey,$encryptedData,$iv){
 require_once ROOTPATH . "/extends/wxUser/wxBizDataCrypt.php";
 $data = array();
 $pc = new WXBizDataCrypt($appid, $sessionKey);
 $errCode = $pc->decryptData($encryptedData, $iv, $data );

 if ($errCode == 0) {
 return $data;
 } else {
 return false;
 }
}

自己写的小工具 request.js

var app = getApp();

//远程请求
var __httpsRequest = {

 //http 请求
 https_request : function(obj){
 wx.request(obj);
 },

 //文件上传
 upload_request : function(dataSource){
 wx.uploadFile(dataSource);
 }
};

module.exports = {
 //执行异步请求get
 httpsRequest:function(obj){
 var jsonUrl = {};
 jsonUrl.url = obj.url;
 if(obj.header)jsonUrl.header=obj.header;
 if(obj.type)
  jsonUrl.method = obj.type;
 else
  jsonUrl.method="GET";
 if(obj.data)jsonUrl.data = obj.data;
 obj.dataType?(jsonUrl.dataType=obj.dataType):(jsonUrl.dataType="json");

 jsonUrl.success = obj.success;

 jsonUrl.data.projectId = app.globalData.projectId;

 __httpsRequest.https_request(jsonUrl);
 },

 //get 请求
 httpsGetRequest:function(req_url,req_obj,res_func)
 {
 var jsonUrl = {
  url:app.globalData.host + req_url,
  header:{"Content-Type":"application/json"},
  dataType:"json",
  method:"get",
  success:function(res)
  {
  typeof res_func == "function" && res_func(res.data);
  }
 }

 if(req_obj)
 {
  jsonUrl.data = req_obj;
 }

 jsonUrl.data.projectId = app.globalData.projectId;

  __httpRequest.https_request(jsonUrl);
 },

 //post 请求
 httpsPostRequest:function(req_url,req_obj,res_func)
 {
 var jsonUrl = {
  url:app.globalData.host + req_url,
  header:{"Content-Type":"application/x-www-form-urlencoded"},
  dataType:"json",
  method:"post",
  success:function(res)
  {
  typeof res_func == "function" && res_func(res.data);
  }
 }

 if(req_obj)
 {
  jsonUrl.data = req_obj;
 }

 jsonUrl.data.projectId = app.globalData.projectId;

  __httpsRequest.https_request(jsonUrl);
 },

 //文件上传
 httpsUpload:function(uid,fileDataSource,res_func)
 {
 dataSource = {
  url:app.globalData.host + req_url,
  header:{
  "Content-Type":"multipart/form-data"
  },
  dataType:"json",
  formData : {
  "uid" : uid
  },
  filePath : fileDataSource,
  name : "fileObj",
  success:function(res){
  typeof res_func == "function" && res_func(res);
  }
 }

 __httpsRequest.upload_request(dataSource);
 }
};

app.globalData.host 就是域名地址如 https://xxxxx.com;

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

Javascript 相关文章推荐
jQuery EasyUI API 中文文档 搜索框
Sep 29 Javascript
jquery 动态创建元素的方式介绍及应用
Apr 21 Javascript
javascript学习笔记(二)数组和对象部分
Sep 30 Javascript
javascript 面向对象封装与继承
Nov 27 Javascript
JS实现仿新浪黄色经典滑动门效果代码
Sep 27 Javascript
Bootstrap框架实现广告轮播效果
Nov 28 Javascript
微信小程序中做用户登录与登录态维护的实现详解
May 17 Javascript
js制作简单的音乐播放器的示例代码
Aug 28 Javascript
jQuery单页面文字搜索插件jquery.fullsearch.js的使用方法
Feb 04 jQuery
Ant-design-vue Table组件customRow属性的使用说明
Oct 28 Javascript
Vue3+elementui plus创建项目的方法
Dec 01 Vue.js
vue实现登录、注册、退出、跳转等功能
Dec 23 Vue.js
vue实现前进刷新后退不刷新效果
Jan 26 #Javascript
Vue2.5 结合 Element UI 之 Table 和 Pagination 组件实现分页功能
Jan 26 #Javascript
微信小程序实现图片压缩功能
Jan 26 #Javascript
js动态添加表格逐行添加、删除、遍历取值的实例代码
Jan 25 #Javascript
Laravel整合Bootstrap 4的完整方案(推荐)
Jan 25 #Javascript
jquery根据name取得select选中的值实例(超简单)
Jan 25 #jQuery
用jquery获取select标签中选中的option值及文本的示例
Jan 25 #jQuery
You might like
如何去掉文章里的 html 语法
2006/10/09 PHP
消息持续发送的完整例子
2006/10/09 PHP
php单件模式结合命令链模式使用说明
2008/09/07 PHP
基于PHP选项与信息函数的使用详解
2013/05/10 PHP
Smarty变量调节器失效的解决办法
2014/08/20 PHP
win10环境PHP 7 安装配置【教程】
2016/05/09 PHP
javascript定义函数的方法
2010/12/06 Javascript
浅谈javascript的原型继承
2012/07/25 Javascript
jquery移除button的inline onclick事件(已测试及兼容浏览器)
2013/01/25 Javascript
javascript中怎么做对象的类型判断
2013/11/11 Javascript
js对文章内容进行分页示例代码
2014/03/05 Javascript
Underscore.js 1.3.3 中文注释翻译说明
2015/06/25 Javascript
JavaScript实现为input与textarea自定义hover,focus效果的方法
2015/08/21 Javascript
Vue学习之路之登录注册实例代码
2017/07/06 Javascript
vue登录注册及token验证实现代码
2017/12/14 Javascript
vue中实现移动端的scroll滚动方法
2018/03/03 Javascript
详解React+Koa实现服务端渲染(SSR)
2018/05/23 Javascript
详解django模板与vue.js冲突问题
2019/07/07 Javascript
VUE实现移动端列表筛选功能
2019/08/23 Javascript
Js利用正则表达式去除字符串的中括号
2020/11/23 Javascript
python在linux中输出带颜色的文字的方法
2014/06/19 Python
Python中的startswith和endswith函数使用实例
2014/08/25 Python
解决Python 遍历字典时删除元素报异常的问题
2016/09/11 Python
Python爬虫代理IP池实现方法
2017/01/05 Python
Python cookbook(数据结构与算法)字典相关计算问题示例
2018/02/18 Python
Python之用户输入的实例
2018/06/22 Python
python如何查看微信消息撤回
2018/11/27 Python
Python基于Tensor FLow的图像处理操作详解
2020/01/15 Python
Python语法之精妙的十个知识点(装B语法)
2020/01/18 Python
Python Map 函数的使用
2020/08/28 Python
俄罗斯香水和化妆品购物网站:Л’Этуаль
2018/05/10 全球购物
英国电视和家用电器购物网站:rlrdistribution.co.uk
2018/11/20 全球购物
Bugatchi官方网站:男士服装在线
2019/04/10 全球购物
工程材料采购方案
2014/05/18 职场文书
2014党员自我评议表范文
2014/09/20 职场文书
三八妇女节慰问信
2015/02/14 职场文书