如何支持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){
});
});
拿到用户的信息之后就好办了,是让用户完善个人信息,还是与自己网站已有的用户账号做绑定就看自己的想法了。
声明:该文观点仅代表作者本人,牛骨文系教育信息发布平台,牛骨文仅提供信息存储空间服务。
- 上一篇: 字体图标使用方法——以Iconfont为例
- 下一篇: Java的内存回收
