微信授权登陆实现

前言
为了更好的用户体验，微信登陆已近必不可少！

一、注册

这里不多说了，网址：https://open.weixin.qq.com/ （微信开放平台）
但是我还是要吐槽一下,真的是无语，一会一个微信开放平台，一会一个微信公众平台，两个账号还不能通用，不能通用不能通用把，两个平台的邮箱注册账号还不能一样！真亏我以前注册了2个邮箱账号！

二、主要流程

官方文档：点击我跳转

主要流程
微信授权登陆实现

2.1 引入样式以及相关js代码

配置显示微信二维码的div

<div id="weixin"></div>

引入js文件

http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js

在需要使用微信登录的地方实例以下JS对象：

var obj = new WxLogin({
id: "weixin",
appid: "你自己申请的小程序会有的",
scope: "snsapi_login",
redirect_uri: "回调地址"    // 扫描二维码就会使用该接口并在该接口后增添参数  ?code=011LSrB80R1abG1k6WD80wk5B80LSnBj&state=undefined
});

例子：如果redirect_uri: “http;//www.guokangjie.cn/weixinlogin” 则用户在扫描二维码时会跳转路径如下 http://www.guokangjie.cn/weixinlogin?code=011LSrB80R1abG1k6WD80wk5B80LSrBj&state=undefined
其中的code 是非常重要的！！！是下一步的关键

2.2、调用接口

2.2.1、通过code获取access_token和openid (使用刚才的code)

调用如下接口

https://api.weixin.qq.com/sns/oauth2/access_token?appid=你自己的APPID&secret=你的AppSecret&code=刚刚获取的code&grant_type=authorization_code

会返回json串如下：

      
{
    "access_token":"18_louWUfx1BmTXOp5HGBoDu75hDDkXP9xwjPlJtG-nrywW5hf0d4-YWRyUZA47LHZ0DR8SgwDEA2gEuWX2X-v1-w",
    "expires_in":7200,
    "refresh_token":"18_px7yKjfWiikiBzNujc8xNG_EbhgXKjWD4F3iItAKl46Amo7sAlvtkPY3qHCYqKm1762FfJSK-0IeD0hjO0R9Ew",
    "openid":"oypcC1tzpTQM3z8oXWgbrWX4dgqQ",
    "scope":"snsapi_login",
    "unionid":"o6JuL1l80GspPSrdODDaSUIRbwGI"
}

其中的access_token和openid是下一步的关键

2.2.2、通过access_token获取该微信用户信息

调用微信获取用户信息接口（使用sccess_token）

http请求方式: GET
https://api.weixin.qq.com/sns/userinfo?access_token=前面你获取的ACCESS_TOKEN&openid=前面你获取的openid

返回用户信息json串

      
{
    "openid":"oypcC1tzgTQM3z8oXWgbrWX4dgqQ",
    "nickname":"城墙",  //微信昵称
    "sex":1,            //性别
    "language":"zh_CN", //语言
    "city":"Suzhou",    //所在城市
    "province":"Anhui",  //所在省份
    "country":"CN",      //所在国家
    "headimgurl":"http://thirdwx.qlogo.cn/mmopen/vi_32/fhOw1icVrUT15pIvqV4C1eUic1OAXOgWRh9ZJUyiaIA5qLKgVTsGa6V9dS3nup7SCb6accqLHYq9T5TtLqqSOsOWA/132", //微信头像
    "privilege":[   //用户特权信息，json数组，如微信沃卡用户为（chinaunicom）
    ],
    "unionid":"o6JuL1l80GskPSrdODDaSUIRowGI"  //用户统一标识。针对一个微信开放平台帐号下的应用，同一用户的unionid是唯一的。
}

3、总结与吐槽

过程如下：
页面生成二维码 ------》用户扫描确认 ------》生成带有code的url ------》使用code获取 access_token和openid ------》使用acess_token和openid获取该微信用户信息 ------》获得用户json串！！

是真的麻烦，直接一个url捎过去，回来一个用户信息不就ok了吗！！哈哈哈！！开个玩笑，毕竟这类东西还是很重要毕竟是用户的个人隐私，安全点比较好！！