微信小程序wx.getUserProfile

很多开发者在打开小程序时就通过组件方式唤起 getUserInfo 弹窗,如果用户点击拒绝,无法使用小程序,这种做法打断了用户正常使用小程序的流程,同时也不利于小程序获取新用户。详情可以点击官方调整链接微信官方链接
微信小程序wx.getUserProfile_第1张图片
前提:

  • 开发者工具版本不低于 1.05.2103022
  • 基础库版本不低于 2.10.4
  • 基础库查看再微信开发工具的详情–>本地设置—>调用基础库
  • 本次使用2.15.0
    微信小程序wx.getUserProfile_第2张图片
    使用:

公用一个登录注册接口:

import http from '../utils/http'

// 主页api 
export default {
      
    registe: data => http.post('/user/login', data, {
      notAuth: true }),
}

1.传统的getUserInfo
html:

<button  open-type="getUserInfo"   lang="zh_CN" bindgetuserinfo="saoMiao">按钮</button>

js:

saoMiao(){
     
	let that =this
    let info = e.detail
    const res = await getApp().login(info);
}

app.js的login方法

  login(e){
     
    const token = wx.getStorageSync('token')
    if (token) return Promise.resolve(true)
    let info = e.userInfo
    return new Promise((resolve, reject) => {
     
      wx.login({
     
        success: async (d) => {
     
          info.code = d.code;
          const res = await api.registe(info);
          if (!res) {
     
            resolve(false)
            return wx.showToast({
     
              icon:'none',
              title: res?.resultMsg ?? '登录失败'
            })
          }
          wx.showToast({
     
            icon:'none',
            title: '登录成功'
          })
          wx.aldstat.sendOpenid(res.resultData.userInfo.openId)
          wx.setStorageSync("token", res.resultData.token)
          wx.setStorageSync("userInfo", res.resultData.userInfo)
          resolve(true)
        },
      })
    })
  },

2.新版本getUserProfile
html:

<button  bindtap="saoMiao">按钮</button>

js:

 	let that =this
    const res = await getApp().newlogin();
    if (!res) return;

app.js的newlogin方法

  newlogin(){
     
    const token = wx.getStorageSync('token')
    if (token) return Promise.resolve(true)
    return new Promise((resolve,rej)=>{
     
      wx.getUserProfile({
     
        desc: '业务需要',
        success:async res => {
     
          wx.login({
     
            success: async (re) => {
     
              if (re.code){
     
                res.userInfo.code=re.code
               const data= await (res.userInfo)
                wx.request({
     
                  url: config.apiBase+'/user/login?code='+re.code,
                  data: res.userInfo,
                  method:"POST",
                  success(resp){
     
                    if (!resp) {
     
                      resolve(false)
                      return wx.showToast({
     
                        icon:'none',
                        title: resp?.resultMsg ?? '登录失败'
                      })
                    }
                    wx.showToast({
     
                      icon:'none',
                      title: '登录成功'
                    })
                    console.log(resp)
                    wx.aldstat.sendOpenid(resp.data.resultData.userInfo.openId)
                    wx.setStorageSync("token", resp.data.resultData.token)
                    wx.setStorageSync("userInfo", resp.data.resultData.userInfo)
                    // resolve(resp)
                    resolve(true)
                  }
                })
              }
            }
          })
        },fail(res){
     
          console.log(res)
          if (res.errMsg=="getUserProfile:fail auth deny"){
     
            wx.showToast({
     
              icon:'none',
              title: '拒绝授权'
            })
          }
        }
      })
    })
  },

你可能感兴趣的:(WEB前端开发,小程序,openid,js)