Open ID Connect atau OIDC adalah suatu identity protocol terbuka yang bertugas mengautentikasi dan mengotorisasi OAuth2, pengguna hanya perlu menggunakan akun yang dia miliki saat ini untuk mengakses banyak aplikasi web tanpa perlu berbagi password akun miliknya. Kita dapat membuat identity provider menggunakan Microsoft Entra ID yang langkah langkahnya dapat dilihat di postingan dengan alamat https://bayuprn.com/2025/05/membuat-openid-oauth2-akses-di-server-azure/
Sebelum memulai, hal yang perlu disiapkan adalah
- IDE Visual Studio 2022 Community Edition
- .NET 9 SDK
- Koneksi internet untuk download Nuget Package
- Identity Provider yang sudah siap dipakai, yang diperlukan adalah client_id, client_secret, dan OpenID Connect metadata URL.
MEMBUAT WEB ASP.NET CORE
Buka IDE Visual Studio 2022 dengan miminal versi Community Edition yang gratis untuk digunakan. Pilih Create New Project dan pilih tipe project dengan nama ASP.NET Core Web Application (Model-View-Controller).
Pertama kita buat website asp.net core dengan template MVC. Kita kasih nama project (agar lebih mudah) misalkan “WebApplicationOpenID“.
Kemudian pada dialog selanjutnya, pilih tipe framework ke .NET 9.0 (Standard Term Support), dan untuk Authentication Type kosongkan saja dan biarkan valuenya menjadi None.
Jika pembuatan project berhasil , maka kita akan dihadapkan pada solution project web baru. Struktur proyek baru tersebut akan memiliki file file seperti berikut ini :
- Folder Controllers berisi file file controller aplikasi web
- Folder Views berisi file template view html untuk tampilan web
Buka terlebih dahulu file dengan nama launchSettings.json yang berada di dalam folder Properties. Kita akan mengganti port https ketika aplikasi dijalankan menjadi port 10000. Lihat pada bagian https dan ubah applicationUrl menjadi https://localhost:10000.
"https": {
"applicationUrl": "https://localhost:10000;http://localhost:5159"
}
Kemudian kita perlu menambahkan package Nuget yang diperlukan untuk otentikasi menggunakan Open ID. Nuget package yang diperlukan adalah
- Microsoft.AspNetCore.Authentication.OpenIdConnect , minimal version 9.0
Pada folder Dependencies dari project, klik kanan dan pilih Manage Nuget packages, kemudian pada tab browse masukkan nama package “Microsoft.AspNetCore.Authentication.OpenIdConnect” sebagai pencarian. Jika ditemukan, klik tombol install untuk menginstallnya.
Saat menginstal mungkin akan tampil dialog konfirmasi persetujuan lisensi. Klik setuju/accept untuk menyetujui instalasi package library tersebut. Jika package selesai diinstal, buka folder Dependencies, lalu buka bagian package, dan pastikan bahwa terdapat package dengan nama “Microsoft.AspNetCore.Authentication.OpenIdConnect”.
Pertama – tama kita perlu menambahkan codingan untuk mengkonfigurasi otentikasi dan otorisasi dari web yang kita buat. Kita dapat melakukannya dengan menambahkan kode di startup project sebelum web berjalan. Hal ini dapat dilakukan dengan menambahkan kode pada file Program.cs yang merupakan startup/entry point dari aplikasi. Berikut adalah kode file Program.cs default dan sama sekali belum dilakukan edit.
namespace WebApplicationOpenID
{
public class Program
{
public static void Main(string[] args)
{
var builder = WebApplication.CreateBuilder(args);
// Add services to the container.
builder.Services.AddControllersWithViews();
var app = builder.Build();
// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
app.UseExceptionHandler("/Home/Error");
// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
app.UseHsts();
}
app.UseHttpsRedirection();
app.UseRouting();
app.UseAuthorization();
app.MapStaticAssets();
app.MapControllerRoute(
name: "default",
pattern: "{controller=Home}/{action=Index}/{id?}")
.WithStaticAssets();
app.Run();
}
}
}
Kita sudah menyiapkan client_id, client_secret, dan url OIDC metadata. Untuk contoh listing proyek di artikel ini, kita akan menggunakan value berikut ini untuk digunakan di proyek. (Jika sudah membuat sendiri di server azure sendiri, maka ganti value nya dengan value client id, client secret, dan url milik anda sendiri).
client_secret: rLn8Q~uzN6rpwAe6ud7J9xQy24B5oEyzW4Od3c~9
client_id: 1ac2b441-d145-4c8f-80b5-02ac3073d10a
openid_metadata: https://login.microsoftonline.com/f6ee1b06-c13e-4317-b681-93603406d1c6/v2.0/.well-known/openid-configuration
Tambahkan potongan kode berikut di file Program.cs , kode ini akan menambahkan service yang di perlukan untuk Authentication dan mengkonfigurasi proses Authentication dari OpenID. Di bagian inilah kita akan memasukkan value dari client_id, client_secret, dan url OpenID Connect metadata. Kita juga mengatur cookie terkait untuk lama waktu expired nya.
Perhatikan untuk Callback Path kita set /signin-oidc hal ini karena merupakan callback handler default dari nuget package Microsoft.AspNetCore.Authentication.OpenIdConnect.
///// taruh listing code berikut setelah var builder = WebApplication.CreateBuilder(args);
//// pada Program.cs
/////
// Add services to the container.
var services = builder.Services;
services.AddAuthorization();
services.AddSession();
// add Authentication
services.AddAuthentication(config =>
{
config.DefaultAuthenticateScheme = OpenIdConnectDefaults.AuthenticationScheme;
config.DefaultScheme = OpenIdConnectDefaults.AuthenticationScheme;
config.DefaultSignInScheme = OpenIdConnectDefaults.AuthenticationScheme;
config.RequireAuthenticatedSignIn = true;
})
.AddOpenIdConnect(config =>
{
config.MetadataAddress = "https://login.microsoftonline.com/f6ee1b06-c13e-4317-b681-93603406d1c6/v2.0/.well-known/openid-configuration";
config.ClientSecret = "rLn8Q~uzN6rpwAe6ud7J9xQy24B5oEyzW4Od3c~9";
config.ClientId = "1ac2b441-d145-4c8f-80b5-02ac3073d10a";
config.SignInScheme = CookieAuthenticationDefaults.AuthenticationScheme;
config.SaveTokens = true;
config.CallbackPath = "/signin-oidc";
config.RequireHttpsMetadata = false;
config.ResponseType = "code id_token";
config.Scope.Add("openid");
config.Scope.Add("profile");
config.Scope.Add("email");
config.GetClaimsFromUserInfoEndpoint = true;
})
.AddCookie(config =>
{
config.SlidingExpiration = true;
config.Cookie.Name = "MyApp";
config.ExpireTimeSpan = TimeSpan.FromMinutes(5);
});
Masih pada file Program.cs, tambahkan potongan kode berikut ini pada baris program setelah app.UseRouting. Tujuannya adalah supaya aplikasi web menggunakan service untuk Authentication dan Authorization dari service yang telah kita tambahkan sebelumnya ke servicecollection.
//// taruh code berikut setelah app.UseRouting();
//// pada Program.cs
app.UseAuthorization();
app.UseAuthentication();
app.UseSession();
Kode yang akan kita buat tidak cukup hanya sampai di situ saja. Kita perlu mengatur mana file yang bisa diakses dengan login dan mana file yang bisa diakses tanpa login. Untuk controller yang hanya bisa diakses dengan login, kita perlu menambahkan attribute Authorize di atas deklarasi dari class controller. Untuk contoh sederhananya, kita gunakan file controller HomeController.cs .
Buka file HomeController.cs, lalu tambahkan attribute [Authorize(AuthenticationSchemes = OpenIdConnectDefaults.AuthenticationScheme)] di atas deklarasi class controllernya. Jika pengguna belum login dan mengakses url /Home/Index maka dia akan dipaksa untuk login terlebih dahulu.
// File HomeController.cs di dalam folder Controllers
[Authorize(AuthenticationSchemes = OpenIdConnectDefaults.AuthenticationScheme)]
public class HomeController : Controller
{
private readonly ILogger<HomeController> _logger;
public HomeController(ILogger<HomeController> logger)
{
_logger = logger;
}
public IActionResult Index()
{
return View();
}
public IActionResult Privacy()
{
return View();
}
[ResponseCache(Duration = 0, Location = ResponseCacheLocation.None, NoStore = true)]
public IActionResult Error()
{
return View(new ErrorViewModel { RequestId = Activity.Current?.Id ?? HttpContext.TraceIdentifier });
}
}
Mari jalankan project dengan start debugging visual studio atau dengan menekan tombol keyboard F5. Tunggu hingga aplikasi berjalan dan coba akses ke https://localhost:10000/Home/Index
Jika konfigurasi sudah benar dan berhasil maka anda akan diarahkan ke halaman login milik microsoft, karena identity provider yang kita gunakan adalah Microsoft Entra ID dari Azure, dan server Azure menggunakan akun microsoft maka kita harus login dengan akun microsoft kita untuk dapat mengakses aplikasi web yang kita buat (bisa hotmail, bisa live.com). Gunakan akun yang sama dengan akun admin dari server azure untuk membuat openid. Jangan gunakan akun google karena kalau menggunakan akun google berarti anda harus mengkonfigurasinya di server google dahulu agar anda mendapatkan client ID, client secret, dan metadata URL. Aplikasi yang anda bikin tidak akan tahu apakah identity providernya microsoft atau google, yang diketahui hanyalah OpenID Connect metadata URL yang didefinisikan sebelumnya.
Nah , jika anda pertama kali login maka biasanya halaman login akan meminta consent permission anda yang tujuannya anda menyetujui bahwa anda menggunakan akun anda untuk login di aplikasi yang saat ini sedang dibuat, dan menghubungkan aplikasi tersebut dengan akun microsoft anda. Biasanya persetujuannya hanya sekali di awal.
Jika anda berhasil mengakses halaman tampilan index dari Home, berarti konfigurasi sudah berhasil. Namun perlu ada sedikit tambahan agar supaya kita bisa mengenali siapa yang saat ini sedang login. Untuk memperoleh user yang aktif saat ini, kita dapat mengaksesnya dari object User Identity dari HttpContext. Property User dari HttpContext.User menyediakan akses ke IIdentity dan Claims pengguna aktif saat ini. Yang kita perlukan adalah
- Mengecek apakah pengguna saat ini sudah di-authenticated
- Mengambil Claims pengguna saat ini, dan menampilkan value dari Claim dengan tipe “name” dan “email”
Berikut adalah tambahan kode pada HomeController.cs yang bertugas mengambil nama lengkap pengguna saat ini dari Claims pengguna dan menyimpannya ke ViewBag.
Listing lengkap file HomeController.cs
using System.Diagnostics;
using System.Security.Claims;
using Microsoft.AspNetCore.Authentication.OpenIdConnect;
using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Mvc;
using WebApplicationOpenID.Models;
namespace WebApplicationOpenID.Controllers
{
[Authorize(AuthenticationSchemes = OpenIdConnectDefaults.AuthenticationScheme)]
public class HomeController : Controller
{
private readonly ILogger<HomeController> _logger;
public HomeController(ILogger<HomeController> logger)
{
_logger = logger;
}
public IActionResult Index()
{
if (HttpContext?.User?.Identity?.IsAuthenticated == true)
{
var claims = HttpContext.User.Claims.ToList();
var claimName = claims.FirstOrDefault(c => c.Type == ClaimTypes.Name || c.Type == "name");
ViewBag.UserFullName = claimName?.Value ?? HttpContext.User.Identity.Name;
}
return View();
}
public IActionResult Privacy()
{
return View();
}
[ResponseCache(Duration = 0, Location = ResponseCacheLocation.None, NoStore = true)]
public IActionResult Error()
{
return View(new ErrorViewModel { RequestId = Activity.Current?.Id ?? HttpContext.TraceIdentifier });
}
}
}
Berikut adalah listing coding dari view Index.cshtml yang menampilkan nama pengguna. Jika aplikasi berjalan dan pengguna berhasil mengakses, maka aplikasi akan menampilkan nama lengkap pengguna. Kita dapat bereksperimen dengan mengubah claim type dari value yang akan ditampilkan untuk menampilkan value lainnya, misalkan email, given_name, family name, prefered_email, job title. Untuk property tambahan dari claim bisa dikonfigurasi dari Microsoft Entra di Azure.
Listing lengkap file Index.cshtml
@{
ViewData["Title"] = "Home Page";
}
<div class="text-center">
<h1 class="display-4">Welcome @ViewBag.UserFullName</h1>
<p>Learn about <a href="https://bayuprn.com">building Web apps with ASP.NET Core</a>.</p>
</div>
Listing lengkap file Program.cs
using Microsoft.AspNetCore.Authentication.Cookies;
using Microsoft.AspNetCore.Authentication.OpenIdConnect;
namespace WebApplicationOpenID
{
public class Program
{
public static void Main(string[] args)
{
var builder = WebApplication.CreateBuilder(args);
// Add services to the container.
var services = builder.Services;
services.AddAuthorization();
services.AddSession();
// add Authentication
services.AddAuthentication(config =>
{
config.DefaultAuthenticateScheme = OpenIdConnectDefaults.AuthenticationScheme;
config.DefaultScheme = OpenIdConnectDefaults.AuthenticationScheme;
config.DefaultSignInScheme = OpenIdConnectDefaults.AuthenticationScheme;
config.RequireAuthenticatedSignIn = true;
})
.AddOpenIdConnect(config =>
{
config.MetadataAddress = "https://login.microsoftonline.com/f6ee1b06-c13e-4317-b681-93603406d1c6/v2.0/.well-known/openid-configuration";
config.ClientSecret = "rLn8Q~uzN6rpwAe6ud7J9xQy24B5oEyzW4Od3c~9";
config.ClientId = "1ac2b441-d145-4c8f-80b5-02ac3073d10a";
config.SignInScheme = CookieAuthenticationDefaults.AuthenticationScheme;
config.SaveTokens = true;
config.CallbackPath = "/signin-oidc";
config.RequireHttpsMetadata = false;
config.ResponseType = "code id_token";
config.Scope.Add("openid");
config.Scope.Add("profile");
config.Scope.Add("email");
config.GetClaimsFromUserInfoEndpoint = true;
})
.AddCookie(config =>
{
config.SlidingExpiration = true;
config.Cookie.Name = "MyApp";
config.ExpireTimeSpan = TimeSpan.FromMinutes(5);
});
builder.Services.AddControllersWithViews();
var app = builder.Build();
// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
app.UseExceptionHandler("/Home/Error");
// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
app.UseHsts();
}
app.UseHttpsRedirection();
app.UseRouting();
app.UseAuthorization();
app.UseAuthentication();
app.UseSession();
app.MapStaticAssets();
app.MapControllerRoute(
name: "default",
pattern: "{controller=Home}/{action=Index}/{id?}")
.WithStaticAssets();
app.Run();
}
}
}
