获取用户信息接口调整

小程序与小游戏获取用户信息接口调整，请开发者注意升级，官宣。

为优化用户体验，原来使用 wx.getUserInfo 接口直接弹出授权框的开发方式将逐步不再支持。从4月30日开始，小程序与小游戏的体验版、开发版调用 wx.getUserInfo 接口，将无法弹出授权询问框，默认调用失败，正式版暂不受影响。

开发者现在可以使用UserInfoButton 按钮来获取用户信息：https://developers./minigame/dev/api/open-api/user-info/wx.createUserInfoButton.html

如上所示，以前的 wx.getUserInfo 接口获取用户信息的方式，现在逐渐开始废弃，而改用 “用户信息按钮 UserInfoButton”的方式，顾名思义它是一个按钮，只有在用户点击它之后才会被动的获取用户信息。

UserInfoButton 获取用户信息

一：使用步骤

是：

1）使用wx.createUserInfoButton(Object object); 创建一个按钮，返回UserInfoButton 对象，此时会在画布上显示按钮

2）使用onTap(function callback)监听用户信息按钮的点击事件，当用户点击按钮后会自动触发，无论用户点击的是“拒绝”还是“允许”，都会进入回调函数。

3）根据需求可以调用hide() 方法隐藏用户信息按钮，调用后，用户信息按钮将不可见

4）在调用 hide() 方法隐藏按钮之后，如果想要是它重新可见，则可以调用 show() 方法。

5）根据需求可以调用offTap(function callback) 方法取消监听用户信息按钮的点击事件

6）根据需要可以调用destroy() 方法销毁用户信息按钮

二：注意事项

wx.createUserInfoButton(Object object) 创建用户信息按钮，从基础库 2.0.1 开始支持，低版本需做兼容处理。所以在微信开发者工具中需要把 “调试基础库” 调高到 2.0.1 及以上，否则会报错：wx.createUserInfoButton is not a function.

三：编码实现

这里只做简单的 API 使用测试，应用中根据需求进行合理的设计，比如何时创建用户信息按钮，何时获取用户信息，何时销毁用户信息按钮，出错处理 等等。

这里直接将测试代码放在小游戏的“入口主函数 main.js"中。如下所示：

/**使用 export 命令定义了模块的对外接口以后，其他 JS 文件就可以通过 import 命令加载这个模块* import 命令接受一对大括号，里面指定要从其他模块导入的变量名。大括号里面的变量名，必须与被导入模块对外接口的名称相同。* 可以参考：/#docs/module* from 后面表示引用的 js 模块文件，后缀名 .js 要写上* */import {Main} from "./Main.js"new Main();// 1）创建用户信息按钮，此时画布上将显示此用户信息按钮let button = wx.createUserInfoButton({type: 'text',text: '获取用户信息',style: {left: 10,top: 76,width: 150,height: 40,lineHeight: 40,backgroundColor: '#ff0000',color: '#ffffff',textAlign: 'center',fontSize: 16,borderRadius: 10}});//监听用户信息按钮的点击事件,用户每点击一次，就会触发一次回答函数button.onTap(function (res) {console.log(res);//res 为 json 格式，用户点击"拒绝"或"允许"都会对应不同的数据});

代码效果如下，

提示：获取用户信息微信授权，当用户点击"允许"后，之后就不会再弹窗，所以如果开发调试时，想让它再次弹窗呢，可以点击微信开发者工具中的“清缓存”按钮，然后选择“全部清除”，即可以清除缓存的数据，之后便会在再次弹框。

在微信开发者工具以及真机上都是亲测有效的，对于wx.createUserInfoButton(Object object)、UserInfoButton 方法的参数，以及返回值，可以参考官网，都有详细的说明。

用户信息按钮不仅可以使用文字，也可以使用图片作为背景，只需要将 wx.createUserInfoButton(Object object) 参数中的 type 参数值改为 image，同时新加 image 参数，值指向图片即可，如下所示：

/**使用 export 命令定义了模块的对外接口以后，其他 JS 文件就可以通过 import 命令加载这个模块* import 命令接受一对大括号，里面指定要从其他模块导入的变量名。大括号里面的变量名，必须与被导入模块对外接口的名称相同。* 可以参考：/#docs/module* from 后面表示引用的 js 模块文件，后缀名 .js 要写上* */import {Main} from "./Main.js"new Main();// 1）创建用户信息按钮，此时画布上将显示此用户信息按钮let button = wx.createUserInfoButton({type: 'image',//类型改为图片image: 'res/login.png',//本地资源目录下的图片style: {left: 10,top: 10,width: 80,height: 80,lineHeight: 40,backgroundColor: '#ff0000',color: '#ffffff',textAlign: 'center',fontSize: 16,borderRadius: 10}});//监听用户信息按钮的点击事件,用户每点击一次，就会触发一次回答函数button.onTap(function (res) {console.log(res);//res 为 json 格式，用户点击"拒绝"或"允许"都会对应不同的数据});

真机上调试效果如下，点击左上角图标之后，就会弹窗授权，允许之后，可以看到调试信息：

如果觉得《微信小游戏 UserInfoButton 获取用户信息》对你有帮助，请点赞、收藏，并留下你的观点哦！