微信小程序中比较常用的就是通过微信的账号体系授权登录了，这样子省去了手动注册登录的流程，而且信息的真实性也是比较可靠的。

这一篇，就是说明在uni-app中怎么实现微信小程序的授权登录操作，结合后端PHP接口实现整个流程

老规矩，开始撸码

步骤：

1. 微信小程序调用 wx.login() 获取 临时登录凭证code ，并回传到开发者服务器。
2. 服务端调用 auth.code2Session 接口，换取 用户唯一标识 OpenID 和 会话密钥 session_key。

这里使用方式一 开发者后台校验与解密开放数据

步骤：

1. 服务端根据微信小程序的appid,用户openid，上一步获取的openid还有wx.getUserInfo()方法获取encryptedData和iv 这4个数据结合官方提供的案例解析出用户信息的数据

2. 若解析成功，执行后续操作；解析失败，查找失败原因。

以上两个步骤就是微信官方提供的授权获取用户信息的方法了，具体可以看文档说明，这里只是简要说明

1.第一步就是小程序先要通过 wx.login()方法获取code，这个只要调用方法即可获取参数。

2.第二步是通过wx.getUserInfo()方法获取encryptedData和iv这两个数据，如果是第一次登录的话，直接调用会直接进入 fail 回调，详见公告，接口升级之后是要使用 button 组件，并将 open-type 指定为 getUserInfo 类型，获取用户基本信息。因为button必须是手动点击触发的，所以实现思路是

2.1点击open-type 指定为 getUserInfo 类型的button,首先获取encryptedData和iv信息，

2.2接着success回调里面调用wx.login()获取code。

2.3将code发送给服务端换取openid和session_key

2.4获取openid成功回调之后将openid和2.1获取到的encryptedData和iv发送给服务端解析用户信息，执行登录成功的操作

3.先上页面截图

4.重点就是 授权登录 这个按钮了

<button open-type="getUserInfo" withCredentials="true" lang="zh_CN" @getuserinfo="getUserInfo">授权登录</button>
复制代码

指定button的open-type类型为 getUserInfo，并设置回调方法getUserInfo()

以下是整个方法执行流程，按照执行顺序依次如下

export default {
	data() {
		return {
		    userdetail: {}
		}
	},
	methods: {
		getUserInfo(res) {
			this.userdetail = res.detail; //将用户信息存起来，下次使用
			this.login();调用wx.login()方法获取code
		},
		login() {
		    uni.login({
			provider: 'weixin',
			    success: res => {
				this.wxLogin(res.code);
			    },
			    fail: err => {
				console.log('err', err);
			    }
			});
		},
                //调用接口,通过code换取openid,session_key保存在服务端解析时会用到
                wxLogin(code) {		    let params = {
			 code
		    };
		    this.$ajax.wxlogin(params).then(res => {
			this.wxAuth(res.data.openid);
		    });
		},
               //解析数据
		wxAuth(openid) {
			let params = {
				openid,
				iv: this.userdetail.iv,
				encryptedData: this.userdetail.encryptedData
			};
			this.$ajax.wxAuth(params).then(res => {
				uni.showToast({
                                        title: '授权成功',
                                        duration: 2000				})			});
		}
	}
}
复制代码

PHP以codeigniter 为例

//获取openid
    public function index_post()
    {
       // 微信 appid及app_secret 微信开发者后台获取
        $appid = ""
        $secret = ""
        $post = $this->input->post();
        $code = trim($post['code']); //获取小程序传递过来的code值
        $ajax_url = "https://api.weixin.qq.com/sns/jscode2session?appid=$appid&secret=$secret&js_code=$code&grant_type=authorization_code";
        $res = functionHelper::ajax_get($ajax_url); 自定义方法发起get请求
        $data = http://www.wxapp-union.com/array();
        if (!empty($res)) {
         //解析成功的数据需要json_decode转成json格式            $res_arr = json_decode($res, true);
            if ($res_arr) {
                //将openid返回给小程序
                $data['data']['openid'] = $res_arr['openid'] ? $res_arr['openid'] : '';
                //session_key保存在redis里面，不返回给小程序，官方是说这样子比较安全，手动狗头
                $this->cache->redis->save($res_arr['openid'], $res_arr['session_key'], 3000);
            }
            //返回数据
            responseHelper::response_ok($this, $data);
        } else {
            responseHelper::response_bad_request($this, "请求失败");
        }
    }

//解密,获取用户信息/手机号码
    public function auth_post()
    {
     // 微信 appid微信开发者后台获取        $appid = "";
        $post = $this->input->post(); //获取小程序传递过来的参数
        $openid = $post['openid'];
        $encryptedData = http://www.wxapp-union.com/$post['encryptedData'];
        $iv = $post['iv'];
        //根据openid从redis里面获取上一步存的对应openid的sessionKey
        $sessionKey = $this->cache->redis->get($openid);
        $pc = new WXBizDataCrypt($appid, $sessionKey);
        $errCode = $pc->decryptData($encryptedData, $iv, $data);
        if ($errCode == 0) {
             //解析成功的数据需要json_decode转成json格式
            $data_arr = json_decode($data, true);
	    responseHelper::response_ok($this, $data_arr);
        } else {
            responseHelper::response_bad_request($this, "解析失败");
        }
    }

//自定义ajax_get完整代码如下,只需传入拼接好的url即可
public static function ajax_get($durl)    {
        // header传送格式
        $headers = array();
        // 初始化
        $curl = curl_init();
        // 设置url路径
        curl_setopt($curl, CURLOPT_URL, $durl);
        // 将 curl_exec()获取的信息以文件流的形式返回，而不是直接输出。
        curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
        // 在启用 CURLOPT_RETURNTRANSFER 时候将获取数据返回
        curl_setopt($curl, CURLOPT_BINARYTRANSFER, true);
        // 添加头信息
        curl_setopt($curl, CURLOPT_HTTPHEADER, $headers);
        // CURLINFO_HEADER_OUT选项可以拿到请求头信息
        curl_setopt($curl, CURLINFO_HEADER_OUT, true);
        // 不验证SSL
        curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, FALSE);
        curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, FALSE);
        // 执行
        $data = http://www.wxapp-union.com/curl_exec($curl);
        // 关闭连接
        curl_close($curl);
        // 返回数据
        return $data;
    }
复制代码

获取手机号码和获取用户的流程和解析方法都是一样的，差别就是 button类型需要设置为getPhoneNumber，仅此一个差别。获取手机号码的流程就留给各位小伙伴自己测试了。