feat(auth): QuantEngine 관리자 로그인 페이지 및 세션 인증 체계 구현 (WBS-AUTH)

This commit is contained in:
2026-07-01 11:12:20 +09:00
parent 24c1cce542
commit bdb9262f4e
10 changed files with 430 additions and 8 deletions
@@ -1,8 +1,11 @@
@inherits LayoutComponentBase @inherits LayoutComponentBase
@inject Microsoft.AspNetCore.Hosting.IWebHostEnvironment WebHostEnvironment @inject Microsoft.AspNetCore.Hosting.IWebHostEnvironment WebHostEnvironment
@inject AuthenticationStateProvider AuthStateProvider
@inject NavigationManager NavigationManager
@using System.IO @using System.IO
@using System.Text.Json @using System.Text.Json
@using Microsoft.FluentUI.AspNetCore.Components @using Microsoft.FluentUI.AspNetCore.Components
@using QuantEngine.Web.Infrastructure
<FluentStack Orientation="Orientation.Vertical" Class="h-100 w-100"> <FluentStack Orientation="Orientation.Vertical" Class="h-100 w-100">
<!-- Header --> <!-- Header -->
@@ -15,6 +18,16 @@
</FluentButton> </FluentButton>
<h1 style="margin: 0; font-size: 20px; font-weight: 600;">QuantEngine v@appVersion</h1> <h1 style="margin: 0; font-size: 20px; font-weight: 600;">QuantEngine v@appVersion</h1>
<AuthorizeView>
<Authorized>
<div style="margin-left: auto; display: flex; align-items: center; gap: 12px;">
<span style="font-size: 13px; color: var(--neutral-foreground-hint);">관리자 (@context.User.Identity?.Name)</span>
<FluentButton OnClick="HandleLogoutAsync" Style="color: #ff5252; background: transparent; border: 1px solid rgba(255, 82, 82, 0.2); cursor: pointer; padding: 4px 12px; border-radius: 4px;">
로그아웃
</FluentButton>
</div>
</Authorized>
</AuthorizeView>
</FluentStack> </FluentStack>
</FluentHeader> </FluentHeader>
@@ -90,5 +103,12 @@
// Fail-safe default fallback values // Fail-safe default fallback values
} }
} }
private async Task HandleLogoutAsync()
{
var customProvider = (CustomAuthenticationStateProvider)AuthStateProvider;
await customProvider.MarkUserAsLoggedOutAsync();
NavigationManager.NavigateTo("login");
}
} }
@@ -0,0 +1,310 @@
@page "/login"
@attribute [AllowAnonymous]
@inject AuthenticationStateProvider AuthStateProvider
@inject NavigationManager NavigationManager
@inject IConfiguration Configuration
<PageTitle>로그인 - QuantEngine</PageTitle>
<div class="auth-container">
<div class="auth-card">
<div class="brand-section">
<img src="images/quant_engine_logo.jpg" alt="QuantEngine Logo" class="brand-logo" />
<h1 class="brand-title">QuantEngine</h1>
<p class="brand-subtitle">은퇴자산포트폴리오 투자 관리 시스템</p>
</div>
<form @onsubmit="HandleLoginAsync" class="auth-form">
<div class="form-group">
<label for="username">관리자 아이디</label>
<input type="text" id="username" class="form-control" @bind="Username" placeholder="아이디를 입력하세요" autocomplete="username" />
</div>
<div class="form-group">
<label for="password">비밀번호</label>
<input type="password" id="password" class="form-control" @bind="Password" placeholder="비밀번호를 입력하세요" autocomplete="current-password" />
</div>
@if (!string.IsNullOrEmpty(ErrorMessage))
{
<div class="error-message">
<svg class="error-icon" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" />
</svg>
<span>@ErrorMessage</span>
</div>
}
<button type="submit" class="btn-submit" disabled="@IsSubmitting">
@if (IsSubmitting)
{
<span class="spinner"></span>
<span>인증 중...</span>
}
else
{
<span>로그인</span>
}
</button>
</form>
</div>
</div>
<style>
.auth-container {
display: flex;
align-items: center;
justify-content: center;
min-height: 100vh;
width: 100vw;
background: linear-gradient(135deg, #090a15 0%, #12142d 100%);
font-family: 'Roboto', 'Inter', sans-serif;
color: #ffffff;
position: fixed;
top: 0;
left: 0;
z-index: 9999;
overflow: hidden;
}
/* Ambient background glow */
.auth-container::before {
content: "";
position: absolute;
width: 600px;
height: 600px;
background: radial-gradient(circle, rgba(0, 242, 254, 0.08) 0%, rgba(79, 172, 254, 0) 70%);
top: -10%;
left: -10%;
pointer-events: none;
}
.auth-container::after {
content: "";
position: absolute;
width: 600px;
height: 600px;
background: radial-gradient(circle, rgba(79, 172, 254, 0.08) 0%, rgba(0, 242, 254, 0) 70%);
bottom: -10%;
right: -10%;
pointer-events: none;
}
.auth-card {
background: rgba(255, 255, 255, 0.02);
backdrop-filter: blur(25px);
-webkit-backdrop-filter: blur(25px);
border: 1px solid rgba(255, 255, 255, 0.06);
border-radius: 20px;
padding: 48px;
width: 440px;
box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4);
display: flex;
flex-direction: column;
align-items: center;
z-index: 10;
animation: fadeIn 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.brand-section {
text-align: center;
margin-bottom: 36px;
display: flex;
flex-direction: column;
align-items: center;
}
.brand-logo {
width: 80px;
height: 80px;
border-radius: 50%;
object-fit: cover;
border: 2px solid rgba(0, 242, 254, 0.3);
box-shadow: 0 0 20px rgba(0, 242, 254, 0.15);
margin-bottom: 16px;
transition: transform 0.3s ease;
}
.brand-logo:hover {
transform: rotate(5deg) scale(1.05);
}
.brand-title {
font-size: 26px;
font-weight: 700;
margin: 0;
background: linear-gradient(90deg, #00f2fe 0%, #4facfe 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
letter-spacing: 0.5px;
}
.brand-subtitle {
font-size: 13px;
color: rgba(255, 255, 255, 0.5);
margin: 6px 0 0 0;
font-weight: 300;
}
.auth-form {
width: 100%;
display: flex;
flex-direction: column;
gap: 20px;
}
.form-group {
display: flex;
flex-direction: column;
gap: 8px;
}
.form-group label {
font-size: 13px;
font-weight: 500;
color: rgba(255, 255, 255, 0.8);
padding-left: 2px;
}
.form-control {
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 10px;
padding: 14px 16px;
color: #ffffff;
font-size: 14px;
transition: all 0.3s ease;
outline: none;
}
.form-control:focus {
border-color: rgba(0, 242, 254, 0.6);
background: rgba(255, 255, 255, 0.08);
box-shadow: 0 0 12px rgba(0, 242, 254, 0.15);
}
.form-control::placeholder {
color: rgba(255, 255, 255, 0.25);
}
.error-message {
display: flex;
align-items: center;
gap: 10px;
background: rgba(239, 68, 68, 0.08);
border: 1px solid rgba(239, 68, 68, 0.2);
border-radius: 10px;
padding: 12px 16px;
color: #f87171;
font-size: 13px;
}
.error-icon {
width: 18px;
height: 18px;
flex-shrink: 0;
}
.btn-submit {
background: linear-gradient(90deg, #00f2fe 0%, #4facfe 100%);
border: none;
border-radius: 10px;
padding: 14px;
color: #0b0c15;
font-size: 15px;
font-weight: 700;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
transition: all 0.3s ease;
box-shadow: 0 4px 15px rgba(0, 242, 254, 0.2);
}
.btn-submit:hover:not(:disabled) {
transform: translateY(-2px);
box-shadow: 0 6px 20px rgba(0, 242, 254, 0.35);
}
.btn-submit:active:not(:disabled) {
transform: translateY(0);
}
.btn-submit:disabled {
opacity: 0.6;
cursor: not-allowed;
box-shadow: none;
}
.spinner {
width: 16px;
height: 16px;
border: 2px solid rgba(11, 12, 21, 0.25);
border-top-color: #0b0c15;
border-radius: 50%;
animation: spin 0.8s linear infinite;
}
@@keyframes spin {
to { transform: rotate(360deg); }
}
@@keyframes fadeIn {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
</style>
@code {
private string Username { get; set; } = string.Empty;
private string Password { get; set; } = string.Empty;
private string ErrorMessage { get; set; } = string.Empty;
private bool IsSubmitting { get; set; } = false;
private async Task HandleLoginAsync()
{
ErrorMessage = string.Empty;
if (string.IsNullOrWhiteSpace(Username) || string.IsNullOrWhiteSpace(Password))
{
ErrorMessage = "아이디와 비밀번호를 모두 입력해 주세요.";
return;
}
IsSubmitting = true;
try
{
// Verify against configurations in appsettings.json
var expectedUser = Configuration["AdminSettings:Username"] ?? "admin";
var expectedPass = Configuration["AdminSettings:Password"] ?? "quant123!";
if (Username == expectedUser && Password == expectedPass)
{
var customProvider = (CustomAuthenticationStateProvider)AuthStateProvider;
await customProvider.MarkUserAsAuthenticatedAsync(Username);
// Redirect back to home dashboard
NavigationManager.NavigateTo("");
}
else
{
ErrorMessage = "아이디 또는 비밀번호가 올바르지 않습니다.";
}
}
catch (Exception ex)
{
ErrorMessage = $"로그인 중 오류가 발생했습니다: {ex.Message}";
}
finally
{
IsSubmitting = false;
}
}
}
@@ -0,0 +1,8 @@
@inject NavigationManager NavigationManager
@code {
protected override void OnInitialized()
{
NavigationManager.NavigateTo("login");
}
}
@@ -1,6 +1,12 @@
<Router AppAssembly="typeof(Program).Assembly" NotFoundPage="typeof(Pages.NotFound)"> <CascadingAuthenticationState>
<Found Context="routeData"> <Router AppAssembly="typeof(Program).Assembly" NotFoundPage="typeof(Pages.NotFound)">
<RouteView RouteData="routeData" DefaultLayout="typeof(Layout.MainLayout)" /> <Found Context="routeData">
<FocusOnNavigate RouteData="routeData" Selector="h1" /> <AuthorizeRouteView RouteData="routeData" DefaultLayout="typeof(Layout.MainLayout)">
</Found> <NotAuthorized>
</Router> <RedirectToLogin />
</NotAuthorized>
</AuthorizeRouteView>
<FocusOnNavigate RouteData="routeData" Selector="h1" />
</Found>
</Router>
</CascadingAuthenticationState>
@@ -1,4 +1,4 @@
@using System.Net.Http @using System.Net.Http
@using System.Net.Http.Json @using System.Net.Http.Json
@using Microsoft.AspNetCore.Components.Forms @using Microsoft.AspNetCore.Components.Forms
@using Microsoft.AspNetCore.Components.Routing @using Microsoft.AspNetCore.Components.Routing
@@ -11,3 +11,6 @@
@using QuantEngine.Web @using QuantEngine.Web
@using QuantEngine.Web.Components @using QuantEngine.Web.Components
@using QuantEngine.Web.Components.Layout @using QuantEngine.Web.Components.Layout
@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Authorization
@using QuantEngine.Web.Infrastructure
@@ -118,7 +118,7 @@ public static class CollectionEndpoints
var runId = Guid.NewGuid().ToString("N"); var runId = Guid.NewGuid().ToString("N");
var now = DateTime.UtcNow.ToString("o"); var now = DateTime.UtcNow.ToString("o");
var body = await request.ReadAsAsync<CollectionRunRequest>(); var body = await request.ReadFromJsonAsync<CollectionRunRequest>();
var account = body?.Account ?? "real"; var account = body?.Account ?? "real";
var tickers = body?.Tickers ?? new List<string> { "005930", "000660" }; var tickers = body?.Tickers ?? new List<string> { "005930", "000660" };
@@ -0,0 +1,65 @@
using System.Security.Claims;
using Microsoft.AspNetCore.Components.Authorization;
using Microsoft.AspNetCore.Components.Server.ProtectedBrowserStorage;
namespace QuantEngine.Web.Infrastructure
{
public class CustomAuthenticationStateProvider : AuthenticationStateProvider
{
private readonly ProtectedLocalStorage _localStorage;
private readonly ClaimsPrincipal _anonymous = new ClaimsPrincipal(new ClaimsIdentity());
private const string StorageKey = "quant_admin_session";
public CustomAuthenticationStateProvider(ProtectedLocalStorage localStorage)
{
_localStorage = localStorage;
}
public override async Task<AuthenticationState> GetAuthenticationStateAsync()
{
try
{
// ProtectedLocalStorage call will throw an exception during pre-rendering
var result = await _localStorage.GetAsync<string>(StorageKey);
if (result.Success && !string.IsNullOrEmpty(result.Value))
{
var username = result.Value;
var identity = new ClaimsIdentity(new[]
{
new Claim(ClaimTypes.Name, username),
new Claim(ClaimTypes.Role, "Admin")
}, "QuantAdminAuth");
var user = new ClaimsPrincipal(identity);
return new AuthenticationState(user);
}
}
catch
{
// Return anonymous state during pre-rendering or if storage reading fails
}
return new AuthenticationState(_anonymous);
}
public async Task MarkUserAsAuthenticatedAsync(string username)
{
await _localStorage.SetAsync(StorageKey, username);
var identity = new ClaimsIdentity(new[]
{
new Claim(ClaimTypes.Name, username),
new Claim(ClaimTypes.Role, "Admin")
}, "QuantAdminAuth");
var user = new ClaimsPrincipal(identity);
NotifyAuthenticationStateChanged(Task.FromResult(new AuthenticationState(user)));
}
public async Task MarkUserAsLoggedOutAsync()
{
await _localStorage.DeleteAsync(StorageKey);
NotifyAuthenticationStateChanged(Task.FromResult(new AuthenticationState(_anonymous)));
}
}
}
+6
View File
@@ -1,6 +1,7 @@
using QuantEngine.Web.Components; using QuantEngine.Web.Components;
using QuantEngine.Web.Services; using QuantEngine.Web.Services;
using QuantEngine.Infrastructure.Data; using QuantEngine.Infrastructure.Data;
using Microsoft.AspNetCore.Components.Authorization;
using QuantEngine.Infrastructure.Repositories; using QuantEngine.Infrastructure.Repositories;
using QuantEngine.Infrastructure.Services; using QuantEngine.Infrastructure.Services;
using QuantEngine.Core.Interfaces; using QuantEngine.Core.Interfaces;
@@ -26,6 +27,11 @@ builder.Host.UseSerilog();
builder.Services.AddRazorComponents() builder.Services.AddRazorComponents()
.AddInteractiveServerComponents(); .AddInteractiveServerComponents();
// Authentication and Custom State Provider
builder.Services.AddCascadingAuthenticationState();
builder.Services.AddScoped<AuthenticationStateProvider, CustomAuthenticationStateProvider>();
builder.Services.AddAuthorizationCore();
// Fluent UI Services // Fluent UI Services
builder.Services.AddFluentUIComponents(); builder.Services.AddFluentUIComponents();
@@ -8,5 +8,9 @@
"AllowedHosts": "*", "AllowedHosts": "*",
"ConnectionStrings": { "ConnectionStrings": {
"DefaultConnection": "Host=127.0.0.1;Database=giteadb;Username=gitea;Password=;Search Path=quantengine;" "DefaultConnection": "Host=127.0.0.1;Database=giteadb;Username=gitea;Password=;Search Path=quantengine;"
},
"AdminSettings": {
"Username": "admin",
"Password": "quant123!"
} }
} }
Binary file not shown.

After

Width:  |  Height:  |  Size: 679 KiB