此教程适合接触微信小程序一段时间，有一点基础的同学参考学习。
服务端语言：PHP 服务端框架：Thinkphp5.0
客户端： 微信小程序框架

客户端

//app.js
var httpclient = require("utils/httpclient");

App({
    onLaunch: function () {
        this.loginWx();
    },

    /**
     * 缓存登录
     */
    cacheLoginWx: function (cb) {
        if (this.userInfo == null) {
            this.loginWx(cb);
        } else {
            typeof cb == "function" && cb(this.userInfo);
        }
    },

    /**
     * 强制登录微信
     */
    loginWx: function (cb) {
        var that = this
        var code = '';
        var openid = '';
        wx.showNavigationBarLoading();
        wx.showLoading({
            title: '努力登录中...',
            mask: true,
        })
        //调用登录接口
        wx.login({
            success: function (obj) {
                wx.hideNavigationBarLoading();
                code = obj.code;
                // console.log(code);
                //请求服务端换取key
                httpclient.request(
                    that.url.head + that.url.wxOnLogin,
                    {
                        code: code,
                    },
                    function (res) {
                        openid = res.openid;
                        that.getUserInfo(cb, openid);
                    },
                    function (res) {
                        console.log('key错误');
                        wx.hideNavigationBarLoading();
                        wx.hideLoading();
                    }
                )
            },
            fail: function () {
                //登录失败
                console.log('授权失败');
                wx.hideNavigationBarLoading();
                wx.hideLoading();
            }
        })
    },

    /**
     * 获取用户信息
     * @param openid=null不解析加密数据
     */
    getUserInfo: function (cb, openid = null) {
        var that = this;
        wx.showNavigationBarLoading();
        //读取用户信息
        wx.getUserInfo({
            success: function (res) {
                wx.hideNavigationBarLoading();
                console.log('授权成功!');
                // console.log(res);
                that.userInfo = res.userInfo;
                //解密数据
                if (openid != null) {
                    that.decodeWxUserInfo(openid, res, cb);
                } else {
                    typeof cb == "function" && cb(that.userInfo);
                }
            },
            fail: function () {
                wx.hideNavigationBarLoading();
                wx.hideLoading();
                //登录失败
                console.log('登录出现网络错误失败');
                typeof cb == "function" && cb(null);
            }
        })
    },

    /**
     * 请求解析微信加密数据
     */
    decodeWxUserInfo: function (openid, obj, cb) {
        var that = this;
        var rawData = obj.rawData;
        var signature = obj.signature;
        var encryptedData = obj.encryptedData;
        var iv = obj.iv;
        wx.showNavigationBarLoading();
        //
        httpclient.request(
            that.url.head + that.url.decodeWxUserInfo,
            {
                openid: openid,
                encryptedData: encryptedData,
                iv: iv,
            },
            function (userData) {
                if (userData.hasOwnProperty('userId')) {
                    that.userInfo.userId = userData.userId;
                }
                if (userData.hasOwnProperty('authority')) {
                    that.userInfo.authority = parseInt(userData.authority);
                }
                console.log(userData);
                //
                wx.hideNavigationBarLoading();
                wx.hideLoading();
                typeof cb == "function" && cb(that.userInfo);
            },
            function (res) {
                console.log('解密数据网络错误');
                wx.hideNavigationBarLoading();
                wx.hideLoading();
            }
        )
    },

    /**
     * 获取用户id
     */
    getUserId() {
        if (this.userInfo == null) return null;
        return this.userInfo.userId;
    },

    /**
     * userInfo 
     */
    userInfo: null,

    /**
     * url
     */
    url: {
        head: "http://192.168.0.1/",
        //consumer
        wxOnLogin: "/public/consumer/Consumer/wxOnLogin",
        decodeWxUserInfo: "/public/consumer/Consumer/decodeWxUserInfo",
    },
})

讲解

注：httpclient.js 是我封装的一个http请求的类，各位可以根据自己服务端返回的json数据格式自定义，这里就不提供代码了。

• cacheLoginWx方法提供缓存登录，你当然不希望自己的程序每次都请求服务器登录吧，所以需要判断登录的地方首先调用这个方法。
• 获取微信登录的code,用此code从自建服务端获取登录用户的openid
• wx.getUserInfo方法可以获取简要的用户信息，比如头像url和昵称，此方法还会返回一个加密过的rawData，如果需要获取更多用户的信息，比如用户的性别，地区等，就需要解密这段数据了
• decodeWxUserInfo会从服务端请求解密数据，此步骤对于不需要用户详细信息的可以省略。

服务端 (语言：php)

服务端就不提供代码了，数据库表不一样，代码写法也不一样，这里只提供一下思路

• 通过code获取openid，地址：$url = “https://api.weixin.qq.com/sns/jscode2session?”;通过此方法获取的数据，可以在数据表里新建一个用户，记录唯一标识openid，此时服务端已经可以认为微信登录成功了。

• 解密数据，我用的官方提供的php Demo，这里有一点非常重要，从官方下载的php文档一定要记得去掉BOM头，否则android手机的用户就会无法登录成功，这一步切记！我用的phpstrom，所以直接可以选择File–Remove BOM。

• openid是用户登录此小程序的唯一标识，同一用户登录小程序，此openid不会变，如果要判断App或是网页里的登录的微信用户是否是同一个用户，需要用到unionid，有需要的同学一定要注意。

结束语

感谢大家的支持，系列教程会不断更新，如果在小程序开发过程中有遇到问题的同学可以私信我，空了一定会予以解答。

[我的网站] http://www.58xinrui.com
码字也是个苦差事，欢迎打赏💰