简单实现微信小程序授权登录

原创

已于 2023-06-16 08:18:33 修改 · 1.4k 阅读

标签

#php #微信小程序

收录于

于 2023-05-13 09:46:08 首次发布

本文介绍了如何简单实现微信小程序的授权登录功能。通过在WXML中使用微信提供的button组件，结合JS中的login方法处理点击事件，以及后端设置相应的接口，可以轻松完成微信授权登录流程。

可以直接复制粘贴，只需要改一些东西就可以了

首先在wxml中用微信自带的button开放属性

<button open-type="getUserProfile" type="primary" bindtap="login">授权登录</button>

然后在对应的js中创建一个login方法，因为上面bindtap指向的是login，所以就要创建一个新的方法

login(evt){
//获取微信授权弹框
  wx.getUserProfile({
    desc: 'desc',
    success:(res)=>{
        //打印是否接到微信数据
      console.log(res);
        //wx.login是登录的意思，就是登录方法
      wx.login({
        success: (res1) => {
          //开始打印看是否接到值
          console.log(res1);
          let code=res1.code;
          let nickname=res.userInfo.nickName;
          let avatarUrl=res.userInfo.avatarUrl;
          //wx.request是跳转后台方法
          wx.request({
            //url跳转的地址(后台的接口)
            url: 'url',
            //怎么请求(可以用get也可以用post)
            method:"POST",
            //data传值,从小程序传到后端的数据
            data:{code:code,nickname:nickname,avatarUrl:avatarUrl},
            //成功回调
            success:function(rrr){
                //wx.navigat