最近完成了博客的评论系统，第三方登录使用了GitHub OAuth App。至于教程或者示例，随便谷歌、百度一下都是一大片，或许正是因为查的太多了，以至于所有的教程都在告诉你怎么注册、怎么调用API、怎么用XXX后端获取数据等等等等…
但是他们好像都忽略了一个问题：
—— 在获取Token或者用户信息之后，客户端要怎么跳转回用户授权之前的页面？
先声明一下，这篇文章不会教你怎么注册或使用GitHub OAuth App，如果你还不熟悉它，可以先阅读一下官方文档，如果你不太喜欢英语，可以看看阮一峰的GitHub OAuth 第三方登录示例教程或者其他大佬/论坛的教程。
好了，先看一下GitHub OAuth的流程：
- 浏览器带
client_id和redirect_uri跳转到GitHub - 用户授权
- 如果用户同意授权，GitHub会返回一个
code参数，形式为https://redirect_uri?code=xxxxxxxxxxxxx - 客户端带
codeclient_id和client_secret发送POST请求到GitHub获取token - 客户端使用
token获取用户信息
如果用URL的跳转来表现的话大概就是这样：
|
对！问题来了！
怎么跳转？跳哪里？
作为开发者，我肯定是想跳回blog.com/post/01.html实现无缝体验对吧…
然而就这个问题，不管是CSDN，还是Stack Overflow，甚至官方文档，
全都没有！
终于，在死了不知道多少脑细胞后，我想出了如下实现过程：
假设用户在
blog.com/post/01.html这张页面上点击了GitHub登录按钮，这个登录按钮不要直接跳转到GitHub授权页面，先跳转到你自己设置的GitHub OAuth App的Callback URL，这里假设是api.blog.com，把当前页面的URL传给api.blog.com，例如：api.blog.com?url=blog.com/post/01.html这样在跳转到
api.blog.com的时候，你就知道了点击登录的是哪张页面了，这时候可以把传过来URL记录到localStorage或者Cookie，甚至是后端的Session，反正不管怎么样，找个地方记录一下就可以了，因为这时候我们还要跳转到github.com，不记录的话就丢失了数据用户在
github.com完成授权后，还是会跳转到api.blog.com，因为跳转前记录了授权前传来的页面URL，在你获取到Token之后，你可以把URL再读取出来：// localStorage 这么用
window.localStorage.getItem('URL');
// Cookie 这么用
// 这个function w3c抄来的
function getCookie(cname) {
var name = cname + "=";
var ca = document.cookie.split(';');
for (var i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}
getCookie('URL');
获取用户信息的请求可以在api.blog.com做，也可以像我一样带着token回到blog.com/post/01.html去做。
因为自己的博客URL特殊，又是Hash又是URL Param(原本是单页App，现在已调整为纯静态，但是不影响思路)，而且也不想用户在回到页面的时候，URL后面跟着一个长长的token，我还新加了一个跳转页面 blog.com/r.html，这个页面负责接收token和跳转的页面，将token写入浏览器存储（上面说的localStorage或者Cookie）之后再进行跳转，在blog.com/post/01.html完成用户信息的调用后删除记录在浏览器存储里面的token。
虽然流程跑通了，但是我还是很好奇为什么GitHub官方文档里完全找不到这一部分的说明，在搜索引擎上也找不到相关文章…
随便吧，现在看起来，只能这样解决…
