![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsISPrdEZwZ1Rh5WNXp1bwNjW1ZUba9VZwlHdsATOfd3bkFGazxCMx8VesATMfhHLlN3XnxCMwEzX0xiRGZkRGZ0Xy9GbvNGLpZTY1EmMZVDUSFTU4VFRR9Fd4VGdsYTMfVmepNHLrJXYtJXZ0F2dvwVZnFWbp1zczV2YvJHctM3cv1Ce-cmbw5SY5QDZyUjM0UWMygjYmJmZ4ADNhRDO2I2Y4ETYjRjZl9CXxIzLcdDMxIDMy8CXn9Gbi9CXzV2Zh1WavwVbvNmLvR3YxUjL1M3Lc9CX6MHc0RHaiojIsJye.png)
前言
很多對外應用的開發都考慮接入第三方登入來提高使用者的體驗感,避免使用者進行繁瑣的注冊登入(登入後的完善資料必不可免)。
而QQ、微信、支付寶、淘寶、微網誌等應用就是首選目标(無他,使用者群體大,支援發開發者授權應用)。
可以點選下面的位址體驗一下。
下面介紹基于OAuth2 的登入元件
1、建立項目
這裡使用 GitHub 登入做示範,因為GitHub的 開發者應用程式 的建立支援localhost的方式通路,可以本地開發直接調用。
建立一個 Asp.Net Core Web 應用(模型-視圖-控制器) 項目,項目名 GithubLogin (你也可以起一個其他的名稱),選擇 .Net Core 3.1 (長期支援) 後建立項目。
2、安裝NuGet包
MrHuo.OAuth.Github
選擇1.0.0進行安裝
3、建立GitHub授權應用
入口1:
通路 https://github.com/settings/applications/new 網站
注意:GitHub網站速度較慢,如果顯示 無法通路此網站 重新整理一下多執行幾次,或者使用第二種入口注冊。
入口2:
通路 https://github.com/ 進行登入,在右上角的頭像圖示旁邊下拉點選設定 Settings,
在出來的頁面點選開發者設定 Developer settings ,
選擇 OAuth App 應用程式,點選 New OAuth App 建立OAuth應用程式
4、配置授權key
把界面裡的
Client ID
,
Client secret
,連同上一個界面裡填寫的
Authorization callback URL
全部填寫到配置檔案對應位置。現在配置檔案
appsettings.json
是這樣的:
{
"Logging": {
"LogLevel": {
"Default": "Information",
"Microsoft": "Warning",
"Microsoft.Hosting.Lifetime": "Information"
}
},
"AllowedHosts": "*",
"oauth": {
"github": {
"app_id": "c147cxxxxxxxxxxxxxxxxxxe6ea2", //OAuth App建立的Client ID
"app_key": "03ef6xxxxxxxxxbe6f4f0febef5", //OAuth App建立的Client secrets
"redirect_uri": "http://localhost:33180/oauth/githubcallback", //回調位址(這個位址是你自己寫的,後面授權成功後做自己需要的功能)
"scope": "repo"
}
}
}
5、編寫代碼
在
Startup.cs
檔案的ConfigureServices方法中注入元件:
services.AddSingleton(new GithubOAuth(OAuthConfig.LoadFrom(Configuration, "oauth:github")));
// This method gets called by the runtime. Use this method to add services to the container.
public void ConfigureServices(IServiceCollection services)
{
services.AddControllersWithViews();
//注入GitHub授權元件
services.AddSingleton(new GithubOAuth(OAuthConfig.LoadFrom(Configuration, "oauth:github")));
}
在Controllers建立OAuthController.cs類,裡面的代碼如下:
using Microsoft.AspNetCore.Mvc;
using MrHuo.OAuth.Github;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
namespace ThirdPartyLogin.Controllers
{
public class OAuthController : Controller
{
#region GitHub授權+回調
//發起第三方授權申請
[HttpGet("oauth/github")]
public IActionResult Github([FromServices] GithubOAuth githubOAuth)
{
return Redirect(githubOAuth.GetAuthorizeUrl());
}
//第三方授權成功後回調方法
[HttpGet("oauth/githubcallback")]
public async Task<IActionResult> GithubCallback(
[FromServices] GithubOAuth githubOAuth,
[FromQuery] string code)
{
return Json(await githubOAuth.AuthorizeCallback(code));
}
#endregion
}
}
然後運作程式,在位址欄手動輸入通路 發起第三方授權申請 的方法:http://localhost:33180/oauth/github 跳轉到授權頁面,
如下,點選綠色的按鈕同意,然後授權成功,
成功後調用我們之前配置的回調方法,在這裡我們就可以自定義操作了,入庫或者其他。
授權成功傳回的内容如下:
經過指定處理後,可視化顯示為:
到這裡一個簡單的第三方GitHub授權指定網站登入就完成了,其他的授權都是大同小異,需要注意的是我們用到的元件需要去找一下,然後去各個平台申請一個key。
當然,我這裡是白嫖的 開發者精選資訊 大佬的,更多用法可以直接去下載下傳demo下來看,最後附上連結,大家可以去看看