如何支持github账号登录

转载自：http://www.cooklife.cn

有些时候我们需要自己的网站支持第三方账号的登录，这里来讲讲如何让自己的网站支持github账号的支持。

1.在github上面建立一个应用对应自己需要接入的网站

首先我们自己需要一个github账号，登录自己的github账号，依次进入菜单Settings-Applications-Register new applications

新建一个应用，这里的应用就是我们需要支持github用户登录的网站，我们需要填写应用的名称，应用的url,应用的描述，以及github鉴权登录之后回调的地址。这里填写的用户的信息在用户通过github的登录页面进行登录你的网站的时候会展示给用户,如下图：

左边画红线的部分，是你的网站需要获取用户的数据，这个获取的数据范围在后面会详细进行介绍。右边画红线的部门就是新建应用时你填写的网站的信息。

注册一个新的引用之后会生成Client Id以及Client Secret,这就是我们接入github 提供的api的凭证。

2.自己网站的登录请求重定向到github提供的验证接口

API文档：https://developer.github.com/v3/oauth/

发送一个get请求到地址：https://github.com/login/oauth/authorize

参数：

参数名	类型	描述
client_id	string	注册应用时的获取的client_id
redirect_uri	string	github鉴权成功之后，重定向到网站
scope	string	获取用户的数据范围，具体的取值可以参照github给出的api文档：https://developer.github.com/v3/oauth/#scopes
state	string	一个随机字符串，github鉴权成功之后会返回。

用户的登录请求被重定向到github的登录页面，登录成功之后，github会提示用户，需要暴露出的数据，用户确认通过之后，github会重新请求新建应用时候的回调地址，并返回参数code以及state。

router.get("/login", function(req, resp){
    var dataStr = (new Date()).valueOf();
    var path = "https://github.com/login/oauth/authorize";
    path += '?client_id=' + gitConfig.clientId;
    path += '&scope='+gitConfig.scope;
    path += '&state='+ dataStr;
    resp.redirect(path);
})

3.通过github返回的code信息请求token信息

这里不知道为啥github不支持返回token信息，而是返回一个参数code，通过这个code，再次去请求token。

我们先还是来看看github给出的接口文档：

接口地址：post   https://github.com/login/oauth/access_token

参数：

参数名	类型	描述
client_id	string	Required. The client ID you received from GitHub when youregistered.
client_secret	string	Required. The client secret you received from GitHub when youregistered.
code	string	Required. The code you received as a response to Step 1.
redirect_uri	string	The URL in your app where users will be sent after authorization. See details below about redirect urls.

响应：

access_token=e72e16c7e42f292c6912e7710c838347ae178b4a&scope=user%2Cgist&token_type=bearer

文档中说明可以设置http请求头accept来返回不同的数据格式，application/json以及application/xml，但是试过之后貌似返回一堆乱码，不知道咋回事。这里就采用默认的键值对格式的字符串，然后自己解析。

router.get("/loginAfter", function(req, resp){
    var code = req.param('code');
    var state = req.param('state');
    var headers = req.headers;
    var path = "/login/oauth/access_token";
    headers.host = 'github.com';

    path += '?client_id=' + gitConfig.clientId;
    path += '&client_secret='+gitConfig.clientSecret;
    path += '&code='+ code;

    var opts = {
        hostname:'github.com',
        port:'443',
        path:path,
        headers:headers,
        method:'POST'
    };
    var req = https.request(opts, function(res){
        res.setEncoding('utf8');
        res.on('data', function(data){
            var args = data.split('&');
            var tokenInfo = args[0].split("=");
            var token = tokenInfo[1];
          
        })
    });

4.根据获取的token去获取用户的信息

GET https://api.github.com/user?access_token=

token拿到了，现在我们只需要通过获取到的token信息去请求用户的信息。

接口地址：GET https://api.github.com/user?access_token=

响应格式json:

  var url = "https://api.github.com/user?access_token="+token;
            https.get(url, function(res){
                res.on('data', function(userInfo){
                   
                });
            });

拿到用户的信息之后就好办了，是让用户完善个人信息，还是与自己网站已有的用户账号做绑定就看自己的想法了。