提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

文章目录

前言

一、微信一键登录是什么？

二、使用步骤

1.在onLoad获取用户登录信息code

2.编写页面button按钮

         3.根据pen-type="getPhoneNumber"获取的用户信息传值给后端

总结

---

前言

在uni-app中使用微信一键登录分析和操作流程

---

一、微信一键登录是什么？

示例：微信一键登录可以获取客户的code,encryptedData,iv进行登录，后端根据appid和secret获取用户信息

二、使用步骤

1.在onLoad获取用户登录信息code

代码如下（示例）：

uni.login({
                    provider: 'weixin',
                    success: (res) => {
                        console.log(res)
                        this.wxcode = res.code
                    }
                })

2.编写页面button按钮

代码如下（示例）：

微信一键登录

3.根据pen-type="getPhoneNumber"获取的用户信息传值给后端

// 微信一键登录
           getPhoneNumber(e) {
         
                if (e.detail.errMsg.indexOf('deny') > -1) {
                    // e.detail.errMsg
                    //获取手机号失败，前往手机登录界面
                    uni.showToast({
                        title: "获取手机号失败，请前往手机登录界面",
                        icon: "none"
                    })
                    this.routeTo();
                    return;
                } else {
                    const encryptedData = e.detail.encryptedData;
                    if (typeof encryptedData === 'undefined' || encryptedData == null || encryptedData === '') {
                        //前往手机登录界面
                        uni.showToast({
                            title: "获取手机号失败，请前往手机登录界面",
                            icon: "none"
                        })
                        this.routeTo();
                        return;
                    }
                }

                uni.showLoading({
                    title: '加载中...'
                });

               // 后端请求 bindWxMobileLogin接口
                bindWxMobileLogin({
                        code: this.wxcode,
                        iv: e.detail.iv,
                        encryptedData: e.detail.encryptedData,
                        // inviter_mobile: "",
                    })
                    .then((res) => {
                        uni.hideLoading()
                        // 缓存token,user，opendId的值
                        uni.setStorageSync('token', res.token)
                        uni.setStorageSync('pUser', res.pUser)
                        uni.setStorageSync('openId', res.openId)
                        uni.reLaunch({
                            url: this.route,
                            animationType: 'pop-in'
                        });

                    })
                    .catch((e) => {
                        uni.showToast({
                            title: "获取手机号失败，请前往手机登录界面",
                            icon: "none"
                        })
                        this.routeTo();
                        return;
                        // uni.hideLoading()
                        // this.getwxLogin()
                        // this.disabled = false;
                    });
            },

             

          //  请求失败想要跳转的页面
            routeTo() {
                return uni.navigateTo({
                    url: "./phone-login",
                    animationDuration: "pop-in",
                })
            },

---

总结

微信一键登录很简单，只需要调用uni.login(),根据 open-type="getPhoneNumber"获取手机号信息，使用@getphonenumber方法，但是有一点很重要，那就是前后端想要保持一样的appid ，还有您使用的appid一定是认证过的，不然可能会报错，或者调不通等情况。