微信小程序获取用户信息：wx.getUserInfo与open-data解析

"微信小程序获取用户信息的两种主要方法是使用`wx.getUserInfo`和`open-data`组件。这两种方法在微信小程序开发中用于获取用户的个人信息，如头像和昵称。随着微信接口的更新，获取用户信息的过程有所变化，需要开发者适应新的规则以避免授权弹窗的缺失。" 在微信小程序中，以前获取用户信息通常采用`wx.getUserInfo`方法。这个方法会在用户授权后返回一个包含用户信息的对象，包括昵称、头像等。以下是一个使用`wx.getUserInfo`的基本示例： ```javascript onLoad: function (options) { var that = this; // 获取用户信息 wx.getUserInfo({ success: function (res) { console.log(res); that.data.userInfo = res.userInfo; that.setData({ userInfo: that.data.userInfo }); } }); } ``` 然而，微信接口的更新导致`wx.getUserInfo`不再直接显示授权弹窗。现在，开发者需要通过`button`组件并设置`open-type="getUserInfo"`来引导用户授权。同时，需要检查`wx.canIUse`来确保用户使用的微信版本支持新接口。以下是使用新方法的例子： ```html <!-- wxml --> <!-- 需要使用button来引导授权登录 --> <button wx:if="{{canIUse}}" open-type="getUserInfo" bindgetuserinfo="bindGetUserInfo">授权登录</button> <view wx:else>请升级微信版本</view> ``` ```javascript Page({ data: { canIUse: wx.canIUse('button.open-type.getUserInfo') }, onLoad: function () { // 查看是否已授权 wx.getSetting({ success: function (res) { if (res.authSetting['scope.userInfo']) { // 已经授权，可以直接调用getUserInfo获取头像昵称 wx.getUserInfo({ success: function (res) { console.log(res.userInfo); } }); } } }); }, bindGetUserInfo: function (e) { console.log(e.detail.userInfo); } }); ``` 此外，`open-data`组件是另一种获取用户基本信息的方式，它可以直接展示用户的微信头像和昵称，而无需调用`wx.getUserInfo`。这种方式通常用于展示已授权用户的静态信息，例如： ```html <view> <open-data type="userAvatarUrl" class="avatar"></open-data> <open-data type="userName" class="nickname"></open-data> </view> ``` 需要注意的是，`open-data`方式不会返回完整的用户信息对象，仅能展示预设的几个属性，如头像URL和昵称，且这些信息是静态的，无法进行修改。 总结来说，微信小程序获取用户信息的方法现在更注重用户体验，需要开发者设计适当的交互流程来引导用户授权。`wx.getUserInfo`与`open-data`组件结合使用，可以在不打扰用户的情况下，实现用户信息的获取和展示。开发者需要根据微信的最新接口调整代码，确保应用的兼容性和用户体验。