Asp.Net Core 2.0+接入IdentityServer Admin並配置角色role控制訪問
阿新 • • 發佈：2019-01-11
1 增加API介面服務
1.1 新增普通asp.net core 站點。
新增XxxxController在任一介面方法頭加Authorize並指定角色。
1 [Authorize(Roles = "FreeUser,Admin")] 2 3 [HttpGet] 4 5 public IActionResult Get() 6 7 { 8 9 return new JsonResult(from c in User.Claims select new { c.Type, c.Value });10 11 }
1.2 啟動項配置
1.2.1 在Startup.ConfigureServices方法中新增如下內容：
1 // 新增許可權驗證 2 3 services.AddMvcCore() 4 5 .AddAuthorization() 6 7 .AddJsonFormatters(); 8 9 // 新增認證配置 10 11 services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme) 12 13 .AddIdentityServerAuthentication(options => 1415 { 16 17 options.Authority = "https://localhost:5001"; // 認證站點地址 18 19 options.RequireHttpsMetadata = false; 20 21 options.ApiName = "api1"; 22 23 options.RoleClaimType = JwtClaimTypes.Role; 24 25 }); 26 27 // 配置跨站 28 29 services.AddCors(options => 30 31 { 32 33 // this defines a CORS policy called "default"34 35 options.AddPolicy("default", policy => 36 37 { 38 39 policy.WithOrigins("https://localhost:5007") // JS站點服務 40 41 .AllowAnyHeader() 42 43 .AllowAnyMethod(); 44 45 }); 46 47 });
1.2.2 啟動項配置Startup.Configure方法中新增如下內容：
1 app.UseCors("default"); 2 3 app.UseAuthentication(); 4 5 app.UseMvc();
2 新增Js客戶端
新建js專案，請參考官方文件（https://identityserver4.readthedocs.io/en/release/quickstarts/7_javascript_client.html）
2.1 安裝依賴
oidc-client。
2.2 新增Html如下：
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> </head> <body> <button id="login">Login</button> <button id="api">Call API</button> <button id="logout">Logout</button> <pre id="results"></pre> <script src="oidc-client.js"></script> <script src="app.js"></script> </body> </html>
2.3 app.js內容如下：
1 function log() { 2 3 document.getElementById('results').innerText = ''; 4 5 6 7 Array.prototype.forEach.call(arguments, function (msg) { 8 9 if (msg instanceof Error) { 10 11 msg = "Error: " + msg.message; 12 13 } 14 15 else if (typeof msg !== 'string') { 16 17 msg = JSON.stringify(msg, null, 2); 18 19 } 20 21 document.getElementById('results').innerHTML += msg + '\r\n'; 22 23 }); 24 25 } 26 27 28 29 document.getElementById("login").addEventListener("click", login, false); 30 31 document.getElementById("api").addEventListener("click", api, false); 32 33 document.getElementById("logout").addEventListener("click", logout, false); 34 35 36 37 var config = { 38 39 authority: "https://localhost:5001", // 認證伺服器 40 41 client_id: "js", 42 43 redirect_uri: "https://localhost:5007/callback.html", // 當前JS站點 44 45 response_type: "id_token token", 46 47 scope:"openid profile api1", 48 49 post_logout_redirect_uri : "https://localhost:5007/index.html", // 當前JS站點 50 51 }; 52 53 var mgr = new Oidc.UserManager(config); 54 55 mgr.getUser().then(function (user) { 56 57 if (user) { 58 59 log("User logged in", user.profile); 60 61 } 62 63 else { 64 65 log("User not logged in"); 66 67 } 68 69 }); 70 71 72 73 function login() { 74 75 mgr.signinRedirect(); 76 77 } 78 79 80 81 function api() { 82 83 mgr.getUser().then(function (user) { 84 85 var url = "https://localhost:5003/identity"; // 要訪問的API介面站 86 87 88 89 var xhr = new XMLHttpRequest(); 90 91 xhr.open("GET", url); 92 93 xhr.onload = function() { 94 95 log(xhr.status, JSON.parse(xhr.responseText)); 96 97 }; 98 99 xhr.setRequestHeader("Authorization", "Bearer " + user.access_token); 100 101 xhr.send(); 102 103 }); 104 105 } 106 107 108 109 function logout() { 110 111 mgr.signoutRedirect(); 112 113 }
2.4 新增回撥頁面如下：
1 <!DOCTYPE html> 2 3 <html> 4 5 <head> 6 7 <meta charset="utf-8" /> 8 9 <title>JS客戶端回撥頁面</title> 10 11 </head> 12 13 <body> 14 15 <script src="oidc-client.js"></script> 16 17 <script> 18 19 new Oidc.UserManager().signinRedirectCallback().then(function () { 20 21 window.location = "index.html"; 22 23 }).catch(function (e) { 24 25 console.error(e); 26 27 }); 28 29 </script> 30 31 </body> 32 33 </html>
3 安裝配置IdentityServerAdmin服務
使用模板建立專案，原始碼地址（https://github.com/IdentityServer/IdentityServer4.Templates）。
3.1 安裝模板
dotnet new -i identityserver4.templates
3.2 建立專案
3.2.1 新增目錄
mkdir UserCenter
cd UseCenter
3.2.2 使用模板生成專案
dotnet new is4admin
開啟專案，並執行。
配置角色
配置使用者
設定使用者角色
新增受保護資源
需要在宣告中新增role。
新增JS客戶端配置
配置URL
新增可訪問的資源
