使用SPA+.NET Core3.1实现 GitHub第三方授权登录 类似使用AspNet.Security.OAuth.GitHub，前端使用如下：VUE+Vue-Router+axios

AspNet.Security.OAuth.GitHub

GitHub https://github.com/aspnet-contrib/AspNet.Security.OAuth.Providers

GitHub授权登录

什么配置的过程不说了。。有一推。

GitHub 第三方登录

给你的网站添加第三方登录以及短信验证成果

下面为示例

client_id:0be6b05fc717bfc4fb67 client_secret:dcaced9f176afba64e89d88b9b06ffc4a887a609

Get

https://github.com/login/oauth/authorize?client_id=0be6b05fc717bfc4fb67&redirect_uri=https://localhost:5001/signin-github

会重定向到

https://localhost:5001/signin-github?code=07537a84d12bbae08361

这个code放到下面的请求中，获取access_token
POST方法（PostMan去请求）

https://github.com/login/oauth/access_token?client_id=0be6b05fc717bfc4fb67&client_secret=dcaced9f176afba64e89d88b9b06ffc4a887a609&code=07537a84d12bbae08361

Get方法

https://api.github.com/user?access_token=787506afa3271d077b98f18af56d7cfdc8db43b4

然后就能获取用户信息

{ "login": "luoyunchong", "id": 18613266, "node_id": "MDQ6VXNlcjE4NjEzMjY2", "avatar_url": "https://avatars1.githubusercontent.com/u/18613266?v=4", "gravatar_id": "", "url": "https://api.github.com/users/luoyunchong", "html_url": "https://github.com/luoyunchong", "followers_url": "https://api.github.com/users/luoyunchong/followers", "following_url": "https://api.github.com/users/luoyunchong/following{/other_user}", "gists_url": "https://api.github.com/users/luoyunchong/gists{/gist_id}", "starred_url": "https://api.github.com/users/luoyunchong/starred{/owner}{/repo}", "subscriptions_url": "https://api.github.com/users/luoyunchong/subscriptions", "organizations_url": "https://api.github.com/users/luoyunchong/orgs", "repos_url": "https://api.github.com/users/luoyunchong/repos", "events_url": "https://api.github.com/users/luoyunchong/events{/privacy}", "received_events_url": "https://api.github.com/users/luoyunchong/received_events", "type": "User", "site_admin": false, "name": "IGeekFan", "company": null, "blog": "https://blog.igeekfan.cn", "location": null, "email": "[email protected]", "hireable": null, "bio": "学习之路漫漫无期。", "public_repos": 14, "public_gists": 0, "followers": 16, "following": 11, "created_at": "2016-04-22T10:33:44Z", "updated_at": "2019-12-21T14:49:33Z" } .NET Core3.1

以下代码为主要代码，完整代码看下面的DEMO链接。

使用WebApi时，看了一些项目，全是基于MVC布局的，，都不是我想要的。看了一些博客上面介绍 ,法式都是陈旧见解，都是共同前后端疏散的。

前端运行在::8081

后端运行在:https://localhost:5001

前后端疏散的SPA 共同第三方授权登录流程如下

本地测试时，gitHub回调地点设置 http(s)://ip:端口/signin-github

如: https://localhost:5001/signin-github。

1. 上面这个明明填写的后真个地点，那后端怎么把功效通知前端呢？

前端请求https://localhost:5001/signin?provider=GitHub&redirectUrl=http://localhost:8080/login-result

供给参数provider为GitHub，

redirectUrl为GitHub授权登录后，回调signin-github后，后端再去重定向的地点，这里填前真个一个路由。

2. 后端只供给了signin，signin-callback路由，没有signin-github，那github上配置的路由是怎么回调回来呢？

google-登录，微软文档，此中有一个变动默认回调 URI,通过 AddGitHub中的CallbackPath属性配置。

介绍了回调地点应配置signin-google,所以这里应该是signin-github，他是可以配置的，不需要本身写措施措置惩罚惩罚signin-google这个路由，内部有中间件已经措置惩罚惩罚了。

3. 回调到signin-github后，后端怎么措置惩罚惩罚，才华让前端刷新。获取登录后的信息呢。

具体上面的按照code获取access_token，按照access_token获取用户的信息的过程，这些措置惩罚惩罚的过程，都不需要我们本身措置惩罚惩罚。我们可以用直接获取用户信息。

一个要领SignIn,只要return Challenge(properties, provider);，

provider 为 GitHub，

properties var properties = new AuthenticationProperties { RedirectUri = url };

这个url为另一个获取用户信息的路由，只要拼接好地点即可。

var authenticateResult = await _contextAccessor.HttpContext.AuthenticateAsync(provider); string email = authenticateResult.Principal.FindFirst(ClaimTypes.Email)?.Value; string name = authenticateResult.Principal.FindFirst(ClaimTypes.Name)?.Value;