[] 카카오 로그인 구현 중

This commit is contained in:
김선규 2025-05-28 17:59:26 +09:00
parent a03aabc8fb
commit e207e246cd
8 changed files with 57 additions and 13 deletions

View File

@ -1,4 +1,4 @@
@* @inherits LayoutComponentBase *@
@inherits LayoutComponentBase
@* *@
@* *@
@* <div class="min-h-screen bg-gray-50 text-gray-900"> *@
@ -19,13 +19,14 @@
@* <Footer/> *@
@* </div> *@
@inherits LayoutComponentBase
<div class="min-h-screen flex flex-col bg-gray-50 text-gray-900">
<!-- Top 영역 -->
@* <TopBanner /> *@
@if (!isHideTop)
{
<TopNav />
}
<!-- 본문 영역 -->
<div class="flex flex-1 flex-col md:flex-row">

View File

@ -0,0 +1,12 @@
using Microsoft.AspNetCore.Components;
namespace Front.Program.Layout;
public partial class MainLayout: LayoutComponentBase
{
[Inject]
NavigationManager Navigation { get; set; } = default!;
protected bool isHideTop => Navigation.Uri.Contains("/auth");
}

View File

@ -3,8 +3,10 @@
<div class="flex flex-col items-center justify-center min-h-screen bg-gray-100">
<h1 class="text-2xl font-bold mb-4">로그인</h1>
<div class="w-full max-w-xs">
<input type="text" placeholder="아이디" class="mb-4 p-2 border border-gray-300 rounded w-full" />
<input type="password" placeholder="비밀번호" class="mb-4 p-2 border border-gray-300 rounded w-full" />
<button @onclick = "KakaoLogin" class="bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700 w-full">로그인</button>
<button type="button" class="w-full mb-4 p-2 rounded focus:outline-none" @onclick="KakaoLogin">
<img src="//k.kakaocdn.net/14/dn/btqCn0WEmI3/nijroPfbpCa4at5EIsjyf0/o.jpg"
alt="카카오 로그인"
class="rounded w-full transition duration-150 hover:brightness-90" />
</button>
</div>
</div>

View File

@ -1,3 +1,4 @@
using Front.Program.Services;
using Microsoft.AspNetCore.Components;
using Microsoft.JSInterop;
@ -7,10 +8,22 @@ public partial class Auth : ComponentBase
{
[Inject] NavigationManager NavigationManager { get; set; } = default!;
[Inject] IJSRuntime JS { get; set; } = default!;
void KakaoLogin()
[Inject] CookieService Cookie {get; set;} = default!;
public async Task KakaoLogin()
{
// await JS
// Redirect to Kakao login page
NavigationManager.NavigateTo("/api/v1/in/user/kakao/auth", true);
var headerKey = "Web_AM_Connect_Key";
// var headerValue = await JS.InvokeAsync<string>("eval", "document.cookie.match(/Web_AM_Connect_Key=([^;]+)/)?.[1] || ''");
// NavigationManager.NavigateTo("/api/v1/in/user/kakao/auth", true);
Cookie.GetCookieAsync(headerKey).ContinueWith(async task =>
{
var cookie = task.Result;
if (!string.IsNullOrEmpty(cookie))
{
await JS.InvokeVoidAsync("postWithHeader", "/api/v1/in/user/kakao/auth", "GET", headerKey, cookie);
}
});
}
}

File diff suppressed because one or more lines are too long

View File

@ -34,7 +34,8 @@
<!-- Blazor WASM 로딩 스크립트 -->
<script src="_framework/blazor.webassembly.js" autostart="false"></script>
<script src="scripts/scroll.js"></script>
<script src="scripts/apiSender.js"></script>
<script>
const MIN_LOADING_MS = 2700;
const loadingStart = performance.now();

View File

@ -0,0 +1,12 @@
window.postWithHeader = function(url, method, headerKey, headerValue) {
fetch(url, {
method: method,
headers: {
[headerKey] : headerValue
}
}).then(res => {
if (res.redirected) {
window.location.href = res.url;
}
});
};

View File

@ -0,0 +1,3 @@
window.scrollToDown = function (y = 0, behavior = "smooth") {
window.scrollTo({ top: y, behavior: behavior });
};