找回密码
 立即注册

QQ登录

只需一步,快速开始

微信小程序综合交流

关注:90

所属分类: 微信开发 微信小程序综合交流

微信小程序用户交流版块,小程序吐槽、作品展示、功能需求等都可以在这里发表,更多微信小程序和微信小游戏作品可以到社区的小程序导航浏览。

微信小程序导航:http://daohang.henkuai.com

[经验分享] 微信小程序获取用户信息接口调整目的以及使用方法介绍

[复制链接]
查看: 4000|回复: 14
最佳答案
0 

0

主题

6

帖子

60

积分

新人求带

积分
60
 楼主| 发表于 2018-5-16 18:44:19 | 显示全部楼层 |阅读模式
本帖最后由 是兄弟就来砍我 于 2018-5-16 18:45 编辑

微信小程序获取用户信息接口调整目的以及使用方法介绍

微信小程序已经调整了获取用户信息的接口,还不知道的开发者看一下官网给出的理由和方法:
为优化用户体验,使用 wx.getUserInfo 接口直接弹出授权框的开发方式将逐步不再支持。从2018年4月30日开始,小程序与小游戏的体验版、开发版调用 wx.getUserInfo 接口,将无法弹出授权询问框,默认调用失败。正式版暂不受影响。开发者可使用以下方式获取或展示用户信息:
1、使用 button 组件,并将 open-type 指定为 getUserInfo 类型,获取用户基本信息。
详情参考文档:
https://developers.weixin.qq.com ... mponent/button.html
2、使用 open-data 展示用户基本信息。
详情参考文档:
https://developers.weixin.qq.com ... nent/open-data.html

微信为什么要调整接口?

开发者可以根据需要来调取用户信息,而不是用户首次进入小程序就弹出授权的弹框,这样对于用户来说是不友好的。比如可以在用户点击登录的时候再获取用户信息,或者提交表单的时候等等,总之可以根据业务逻辑进行开发。

然而对于我们项目的业务逻辑却是不好的事儿,因为我们需要在一开始就获取用户的信息入库,相信很多人都会有这样的需求,那就记录一下我们项目的登录。

首先自己写一个弹框,触发获取信息的内容,微信小程序原生组件弹框没有可以编辑的按钮,所以需要我们自己来写,如图:
20180504101520580.png

代码如下:
  1. <!-- 自定义弹框开始 -->
  2.   <view wx:if="{{showModel}}" class="model">
  3.     <view class="modelTitle">
  4.       获取微信授权信息
  5.     </view>
  6.     <view class="modelBody">微信登录需要获取您的用户信息,请前往设置</view>
  7.     <view class="btns">
  8.       <button open-type="getUserInfo" class="agree" bindgetuserinfo="agreeGetUser" lang="zh_CN">去设置</button>
  9.     </view>
  10.   </view>
  11.   <view wx:if="{{showModel}}" class="mask"></view>
  12.   <!-- 自定义弹框结束 -->
复制代码

判断是否授权,如果没有授权,那么需要自定义弹框显示,点击“去设置”,然后弹出授权框;如果已经授权,逻辑上就应该不再弹出任何框,这里就需要把用户首次进入小程序授权的用户信息存在本地然后那来使用
  1. // 登录
  2.     wx.login({
  3.       success: res => {
  4.         app.globalData.code = res.code
  5.         //取出本地存储用户信息,解决需要每次进入小程序弹框获取用户信息
  6.         app.globalData.userInfo = wx.getStorageSync('userInfo')
  7.         //wx.getuserinfo接口不再支持
  8.         wx.getSetting({
  9.           success: (res) => {
  10.             //判断用户已经授权。不需要弹框
  11.             if(!res.authSetting['scope.userInfo']){
  12.               that.setData({
  13.                 showModel: true
  14.               })
  15.             }else{//没有授权需要弹框
  16.               that.setData({
  17.                 showModel: false
  18.               })
  19.               wx.showLoading({
  20.                 title: '加载中...'
  21.               })
  22.               that.getOP(app.globalData.userInfo)
  23.             }
  24.           },
  25.           fail: function () {
  26.             wx.showToast({
  27.               title: '系统提示:网络错误',
  28.               icon: 'warn',
  29.               duration: 1500,
  30.             })
  31.           }
  32.         })
  33.       },
  34.       fail:function () {
  35.         wx.showToast({
  36.           title:'系统提示:网络错误',
  37.           icon: 'warn',
  38.           duration: 1500,
  39.         })
  40.       }
  41.     })
  42.   },
  43.   //获取用户信息新接口
  44.   agreeGetUser:function (e) {
  45.     //设置用户信息本地存储
  46.     try {
  47.       wx.setStorageSync('userInfo', e.detail.userInfo)
  48.     } catch (e) {
  49.       wx.showToast({
  50.         title: '系统提示:网络错误',
  51.         icon: 'warn',
  52.         duration: 1500,
  53.       })
  54.     }
  55.     wx.showLoading({
  56.       title:'加载中...'
  57.     })
  58.     let that = this
  59.     that.setData({
  60.       showModel:false
  61.     })
  62.     that.getOP(e.detail.userInfo)
  63.   },
  64.   getOP: function (res) {//提交用户信息 获取用户id
  65.     let that = this
  66.     let userInfo = res
  67.     app.globalData.userInfo = userInfo
  68.     wx.request({
  69.       url: 'https://xcx.xiancaijun.cn/tigerlogin/tgLogin',
  70.       method: 'post',
  71.       data: {
  72.         "code": app.globalData.code,
  73.         'userInfo': userInfo
  74.       },
  75.       success: function (res) {
  76.         if(res.data.respcode == '0'){
  77.           app.globalData.userId = res.data.uid
  78.           app.globalData.keys = res.data.keys
  79.           app.globalData.access = res.data.access
  80.           that.getBook()
  81.           that.shareInfo()
  82.           if (that.data.cid) {
  83.             wx.navigateTo({
  84.               url: '/pages/course/course?cid=' + that.data.cid
  85.             })
  86.           }
  87.         }else if(res.data.respcode == '15'){
  88.           wx.hideLoading()
  89.           wx.showToast({
  90.             title:'没有授权,不能进入小程序',
  91.             icon:'none',
  92.             duration:2000
  93.           })
  94.         }

  95.       }
  96.     })
  97.   },
复制代码

微信小程序获取用户信息接口的调整,有需要的开发者可以参考下
回复

使用道具 举报

最佳答案
0 

6

主题

2195

帖子

7028

积分

S1

积分
7028
发表于 2018-5-16 19:08:28 | 显示全部楼层
大神,具体如何改代码,求指点,感谢。
以下是我微擎的app.js

  1. //var push = require("");

  2. App({
  3.     onLaunch: function() {},
  4.     onShow: function() {},
  5.     onHide: function() {
  6.         console.log(getCurrentPages());
  7.     },
  8.     onError: function(e) {
  9.         console.log(e);
  10.     },
  11.     getUser: function(s) {
  12.         var c = this;
  13.         wx.login({
  14.             success: function(e) {
  15.                 var t = e.code;
  16.                 wx.setStorageSync("code", t), wx.getUserInfo({
  17.                     success: function(e) {
  18.                         console.log(e), wx.setStorageSync("user_info", e.userInfo);
  19.                         var n = e.userInfo.nickName, o = e.userInfo.avatarUrl;
  20.                         c.util.request({
  21.                             url: "entry/wxapp/openid",
  22.                             cachetime: "0",
  23.                             data: {
  24.                                 code: t
  25.                             },
  26.                             success: function(e) {
  27.                                 console.log(e), wx.setStorageSync("key", e.data.session_key), wx.setStorageSync("openid", e.data.openid);
  28.                                 var t = e.data.openid;
  29.                                 c.util.request({
  30.                                     url: "entry/wxapp/Login",
  31.                                     cachetime: "0",
  32.                                     data: {
  33.                                         openid: t,
  34.                                         img: o,
  35.                                         name: n
  36.                                     },
  37.                                     success: function(e) {
  38.                                         console.log(e), wx.setStorageSync("users", e.data), wx.setStorageSync("uniacid", e.data.uniacid),
  39.                                         s(e.data);
  40.                                     }
  41.                                 });
  42.                             }
  43.                         });
  44.                     },
  45.                     fail: function(e) {
  46.                         wx.getSetting({
  47.                             success: function(e) {
  48.                                 0 == e.authSetting["scope.userInfo"] && wx.openSetting({
  49.                                     success: function(e) {
  50.                                         e.authSetting["scope.userInfo"], c.getUser(s);
  51.                                     }
  52.                                 });
  53.                             }
  54.                         });
  55.                     }
  56.                 });
  57.             }
  58.         });
  59.     },
  60.     ormatDate: function(e) {
  61.         var t = new Date(1e3 * e);
  62.         return t.getFullYear() + "-" + n(t.getMonth() + 1, 2) + "-" + n(t.getDate(), 2) + " " + n(t.getHours(), 2) + ":" + n(t.getMinutes(), 2) + ":" + n(t.getSeconds(), 2);
  63.         function n(e, t) {
  64.             for (var n = "" + e, o = n.length, s = "", c = t; c-- > o; ) s += "0";
  65.             return s + n;
  66.         }
  67.     },
  68.     ab: function(e) {},
  69.     util: require("we7/resource/js/util.js"),
  70.     siteInfo: require("siteinfo.js"),
  71.     tabBar: {
  72.         color: "#123",
  73.         selectedColor: "#1ba9ba",
  74.         borderStyle: "#1ba9ba",
  75.         backgroundColor: "#fff",
  76.         list: [ {
  77.             pagePath: "/we7/pages/index/index",
  78.             iconPath: "/we7/resource/icon/home.png",
  79.             selectedIconPath: "/we7/resource/icon/homeselect.png",
  80.             text: "首页"
  81.         }, {
  82.             pagePath: "/we7/pages/user/index/index",
  83.             iconPath: "/we7/resource/icon/user.png",
  84.             selectedIconPath: "/we7/resource/icon/userselect.png",
  85.             text: "我的"
  86.         } ]
  87.     },
  88.     globalData: {
  89.         userInfo: null
  90.     }
  91. });
复制代码
回复 支持 反对

使用道具 举报

最佳答案
1 

17

主题

546

帖子

8855

积分

S1

架构

积分
8855
发表于 2018-5-16 19:58:29 | 显示全部楼层
这样调整的意义是什么呢?
回复 支持 反对

使用道具 举报

最佳答案
0 

1

主题

366

帖子

3215

积分

专家路上

积分
3215
发表于 2018-5-16 20:15:09 | 显示全部楼层
这样可以吗
回复 支持 反对

使用道具 举报

最佳答案
0 

0

主题

6

帖子

60

积分

新人求带

积分
60
 楼主| 发表于 2018-5-16 20:16:06 | 显示全部楼层
yinuo2016 发表于 2018-5-16 19:58
这样调整的意义是什么呢?

对用户友好很多啊
回复 支持 反对

使用道具 举报

最佳答案
0 

30

主题

55

帖子

1075

积分

专家路上

积分
1075
发表于 2018-5-16 22:07:21 | 显示全部楼层
shier 发表于 2018-5-16 19:08
大神,具体如何改代码,求指点,感谢。
以下是我微擎的app.js

微擎那边没有做更新吗
回复 支持 反对

使用道具 举报

最佳答案
0 

2

主题

375

帖子

4298

积分

专家路上

积分
4298
发表于 2018-5-17 09:56:56 | 显示全部楼层
开发者可以根据需要来调取用户信息,而不是用户首次进入小程序就弹出授权的弹框,这样对于用户来说是不友好的。
回复 支持 反对

使用道具 举报

最佳答案
0 

1

主题

17

帖子

593

积分

略知一二

积分
593
发表于 2018-5-17 12:55:36 | 显示全部楼层
接口改动后应该是取消了默认获取用户信息,改为用户主动确认授权提交用户信息,好一点是保护了用户隐私吧?

MARK一下  备用
回复 支持 反对

使用道具 举报

最佳答案
0 

0

主题

341

帖子

2712

积分

专家路上

积分
2712
发表于 2018-5-21 17:21:02 | 显示全部楼层
恭喜发财
回复

使用道具 举报

最佳答案
0 

0

主题

190

帖子

690

积分

略知一二

积分
690
发表于 2018-5-22 09:54:48 | 显示全部楼层
三大反反复复发放的撒旦
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则



www.henkuai.com—微信开发者的分享交流平台,专注微信开发生态。

天津市滨海新区
中新生态城中成大道生态建设公寓9号楼3层301

微信公众号

广告推广
QQ:805874290

市场合作
zhongcong@henkuai.com