IdentityServer4使用教程2--搭建ID4的MVC客戶端

前言

看了教程1以后,很多人問道Client的里面那些配置項是什么意思,希望了解更多的理論知識。但是我覺得IT雖然是理工科,確是一個實踐科學,需要很多感性認識。學習IT最好的辦法是動手去做,所謂守破離(Shu Ha Ri),首先要模仿得到足夠的實踐知識,然后是了解理論,然后是突破! 當然,如果現(xiàn)在就想知道理論,可以參看Identity Server3 教程目錄(http://www.lxweimin.com/p/398b226e41ed),雖然是ID3的介紹,但是理論沒什么變化。

按照IdentityServer4使用教程1,我們已經(jīng)得到了一個ID4的服務器了。如果不想按照前面的步驟創(chuàng)建工程,可以用下面的代碼clone出step-1代碼:git clone -b step-1 https://github.com/miemengniao/ID4.Learn.git
當然,也可以直接clone出本教程完成后的代碼git clone -b step-2 https://github.com/miemengniao/ID4.Learn.git

準備工作

我們首先創(chuàng)建一個MVC客戶端,然后創(chuàng)建一個solution,把之前的ID4 Server和這個MVC 客戶端加入到這個解決方案中。

  1. 創(chuàng)建一個MVC客戶端 dotnet new mvc --auth None -o ID4.MvcClient,注意:我們這里面選則--auth None
  2. 轉(zhuǎn)到ID4.MvcClient目錄并添加所需要的包
cd ID4.MvcClient
dotnet add package Microsoft.AspNetCore.Authentication.Cookies --version 1.1.2
dotnet add package Microsoft.AspNetCore.Authentication.OpenIdConnect --version 1.1.2
  1. 我們回到根目錄,創(chuàng)建一個solution,并添加ID4.Server和ID4.MvcClient到這個解決方案中,并編譯這個工程
cd ..
dotnet new sln -n ID4.Learn
dotnet sln add .\ID4.Server\ID4.Server.csproj
dotnet sln add .\ID4.MvcClient\ID4.MvcClient.csproj
dotnet restore
dotnet build

修改MVC客戶端支持ID4

增加一個受控頁面
  1. .\ID4.MvcClient\Views\Home目錄下創(chuàng)建一個Auth.cshtml文件,來顯示將來登陸用戶的聲明(claims)信息。
<dl>
  @foreach (var claim in User.Claims)
    {
        <dt>@claim.Type</dt>
        <dd>@claim.Value</dd>
    }
</dl>

可以通過curl -k -O https://raw.githubusercontent.com/miemengniao/ID4.Learn/step-2/ID4.MvcClient/Views/Home/Auth.cshtml 直接下載

  1. 修改.\ID4.MvcClient\Views\Shared\_Layout.cshtml文件,在導航欄增加Auth的超鏈接
    <li><a asp-area="" asp-controller="Home" asp-action="Auth">Auth</a></li>

可以通過curl -k -O https://raw.githubusercontent.com/miemengniao/ID4.Learn/step-2/ID4.MvcClient/Views/Shared/_Layout.cshtml下載更新后的_Layout文件

  1. 修改```.\ID4.MvcClient\Controllers\HomeController.cs文件,增加Auth對應的Action
 [Authorize]
        public IActionResult Auth()
        {
            return View();
        }

可以通過curl -k -O https://raw.githubusercontent.com/miemengniao/ID4.Learn/step-2/ID4.MvcClient/Controllers/HomeController.cs下載更新后的HomeController.cs文件

修改Startup文件,增加ID4的授權(quán)認證
  1. 在startup的Configure方法的UseStaticFiles的調(diào)用后面,加上如下代碼,訪問ID4.Server進行認證:
app.UseCookieAuthentication(new CookieAuthenticationOptions
{
    AuthenticationScheme = "Cookies"
});

JwtSecurityTokenHandler.DefaultInboundClaimTypeMap.Clear();

app.UseOpenIdConnectAuthentication(new OpenIdConnectOptions
{
    AuthenticationScheme = "oidc",
    SignInScheme = "Cookies",

    Authority = "http://localhost:5000",
    RequireHttpsMetadata = false,

    ClientId = "mvc",
    ClientSecret = "secret",
    ResponseType = "code id_token",

    GetClaimsFromUserInfoEndpoint = true,
    SaveTokens = true
});

可以通過curl -k -O https://raw.githubusercontent.com/miemengniao/ID4.Learn/step-2/ID4.MvcClient/Startup.cs下載更新后的Startup.cs文件. 如果是手動添加代碼,注意要添加using語句來導入命名空間

  1. 更新Program.cs文件,來指定啟動端口為5002.
.UseUrls("http://localhost:5002/")

可以通過curl -k -O https://raw.githubusercontent.com/miemengniao/ID4.Learn/step-2/ID4.MvcClient/Program.cs下載更新后的Startup.cs文件. 如果是手動添加代碼,注意要添加using語句來導入命名空間

  1. 啟動ID4 Server和MVC客戶端
    因為dotnet CLI不能通過solution文件同時啟動兩個項目,所以需要打開兩個cmd界面,分別進入到ID4.Server和ID4.MvcClient目錄,運行dotnet run
    啟動好以后,在瀏覽器重輸入http://localhost:5002,并點擊Auth鏈接,瀏覽器跳轉(zhuǎn)到localhost:5000要求登陸。登陸后,即可看到如下頁面,登陸用戶的所有claim(聲明)信息將列出。

如果之前沒有再localhost:5000創(chuàng)建用戶,可能需要預先在localhost:5000創(chuàng)建好測試用戶

登陸用戶的聲明信息

下一節(jié),我們會配置一個Web API來使用這個ID4認證服務器,敬請期待 ??

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 230,825評論 6 546
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 99,814評論 3 429
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 178,980評論 0 384
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經(jīng)常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 64,064評論 1 319
  • 正文 為了忘掉前任,我火速辦了婚禮,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,779評論 6 414
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 56,109評論 1 330
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 44,099評論 3 450
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 43,287評論 0 291
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 49,799評論 1 338
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 41,515評論 3 361
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,750評論 1 375
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 39,221評論 5 365
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 44,933評論 3 351
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 35,327評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,667評論 1 296
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,492評論 3 400
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,703評論 2 380

推薦閱讀更多精彩內(nèi)容