微信网页开发--获取微信用户信息

流程

1. 用户扫码或者直接点击链接进入我们的入口页面；
2. 进入授权登录页面，用户点击授权登录按钮；
3. 微信会自动将我么的网页授权域名后增加参数；
4. 根据微信给的code去获取当前登录的微信用户的用户信息。

具体操作过程

1.配置网页授权域名


这里的域名设置只能设置一个，要求就按照微信的操作就可以。由于这个域名还是公司的，所以这里都马赛克处理了。
我们需要确保我们获取了权限
开发–>权限接口–>网页服务–>网页授权

2.配置txt路径可以访问
我的项目目录：

微信的要求：wx.qq.com/mp/MP_verify_2poeJ5jQBozaGbNV.txt
我使用的Node.js+Express的框架，可以看这里之前的一些文章Node.js这里有Express的安转和新建项目、路由等。

router.all('/mp/MP_verify_xxxxx.txt', function(req, res, next) {
    res.sendfile("./wx/MP_verify_xxxxx.txt");
});

当我们在浏览器输入：xxx.cn/mp/MP_verify_xxxxx.txt的时候可以看见里面的信息。这个感觉是微信那边需要验证我们的网页授权域名是否设置正确。
这一步
3.阅读网页网页授权流程
微信网页授权文档大家先仔细看看文档。
- 用户同意获取code
这里我们需要严格的按照微信的要求谁知url路径：
https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect
尤其注意：由于授权操作安全等级较高，所以在发起授权请求时，微信会对授权链接做正则强匹配校验，如果链接的参数顺序不对，授权页面将无法正常访问。这里也就是我在流程介绍里面的第一点介绍的入口页面。
之后会跳转到微信授权登录的页面

点击授权登录按钮之后就会跳转到xx.cn/mp的页面这里我们就可获取到code了。
- 获取用户信息
获取用户信息其实基本都是后台做的事，因为微信不允许我们子啊前台调用微信的接口，不管怎么搞都是跨域，而且微信也说了这个需要在后台操作。
剩下的步骤看文档就很明确了。我的后台代码。

/*
 * 根据code获取微信用户的用户信息
 */
router.get('/mp/getUserInfo', function(req, res, next) {
    var param = req.query || req.params; 
    var code = param.code;
    var url = 'https://api.weixin.qq.com/sns/oauth2/access_token?appid=' + wxConfig.AppID + '&secret=' + wxConfig.Secret + '&code=' + code + '&grant_type=authorization_code';
    request(url, function (error, response, access_token_body) {
        if (!error && response.statusCode == 200) {
            var access_token_data = JSON.parse(access_token_body); 
            // 获取access_token后 就做缓存
            // access_token 有效期是7200s
            var userinfoUrl = 'https://api.weixin.qq.com/sns/userinfo?access_token=' + access_token_data.access_token + '&openid=' + access_token_data.openid + '&lang=zh_CN ';
            request(userinfoUrl, function (error, response, userinfo_body) {
                if (!error && response.statusCode == 200) {
                    var userinfo_data = JSON.parse(userinfo_body); 
                    res.end(JSON.stringify(userinfo_data));
                }
            })
        }
    })
});

前台只需要调用 getUserInfo这个接口，传入code就可以获取到了。这里关于 access_token的时效性还没处理。 这里我是直接把微信返回的数据给了前台处理。

最后

至此，微信网页开发–获取微信用户信息就介绍完了。
由于是第一次做微信网页开发，中间遇见过跨域的问题(上面有说为什么跨域)，也不知道具体流程是怎样的，基本就是一边踩坑一边总结出来的流程。