OAuth 인증 처리 로직 개선 및 토큰 관리 기능 추가
This commit is contained in:
parent
152f3ec045
commit
48af411c99
2 changed files with 324 additions and 8 deletions
|
|
@ -2,16 +2,69 @@
|
|||
<html>
|
||||
<head>
|
||||
<title>OAuth Callback</title>
|
||||
<style>
|
||||
body { font-family: Arial, sans-serif; margin: 40px; }
|
||||
.status { padding: 10px; margin: 10px 0; border-radius: 5px; }
|
||||
.success { background-color: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
|
||||
.error { background-color: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }
|
||||
.info { background-color: #d1ecf1; color: #0c5460; border: 1px solid #bee5eb; }
|
||||
pre { background-color: #f8f9fa; padding: 15px; border-radius: 5px; border: 1px solid #dee2e6; overflow-x: auto; white-space: pre-wrap; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h2>처리 중입니다...</h2>
|
||||
<h2>OAuth 인증 처리 중...</h2>
|
||||
<div id="status" class="status info">처리 중입니다...</div>
|
||||
|
||||
<script>
|
||||
const hash = window.location.hash.substring(1); // '#access_token=...'
|
||||
const params = new URLSearchParams(hash);
|
||||
const accessToken = params.get("access_token");
|
||||
async function handleCallback() {
|
||||
try {
|
||||
// URL에서 authorization code 또는 access token 확인
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
const hash = window.location.hash.substring(1);
|
||||
const hashParams = new URLSearchParams(hash);
|
||||
|
||||
const authCode = urlParams.get("code");
|
||||
const accessToken = hashParams.get("access_token");
|
||||
const error = urlParams.get("error");
|
||||
|
||||
location.href = "/token?access_token=" + accessToken;
|
||||
const statusDiv = document.getElementById("status");
|
||||
|
||||
if (error) {
|
||||
statusDiv.className = "status error";
|
||||
statusDiv.innerHTML = `오류 발생: ${error}`;
|
||||
return;
|
||||
}
|
||||
|
||||
if (authCode) {
|
||||
// Authorization Code 방식 (새로운 방식 - 리프레시 토큰 포함)
|
||||
statusDiv.innerHTML = "Authorization Code를 처리하는 중...";
|
||||
|
||||
const response = await fetch(`/exchange?code=${authCode}`);
|
||||
const result = await response.json();
|
||||
|
||||
if (result.success) {
|
||||
statusDiv.className = "status success";
|
||||
statusDiv.innerHTML = `<h3>✅ 인증 성공!</h3><pre>${JSON.stringify(result, null, 2)}</pre>`;
|
||||
} else {
|
||||
statusDiv.className = "status error";
|
||||
statusDiv.innerHTML = `<h3>❌ 토큰 교환 실패</h3><pre>${JSON.stringify(result, null, 2)}</pre>`;
|
||||
}
|
||||
} else if (accessToken) {
|
||||
// 기존 방식 (Access Token 직접 받기)
|
||||
statusDiv.innerHTML = "Access Token을 처리하는 중...";
|
||||
location.href = "/token?access_token=" + accessToken;
|
||||
} else {
|
||||
statusDiv.className = "status error";
|
||||
statusDiv.innerHTML = "Authorization Code나 Access Token을 찾을 수 없습니다.";
|
||||
}
|
||||
} catch (error) {
|
||||
document.getElementById("status").className = "status error";
|
||||
document.getElementById("status").innerHTML = `처리 중 오류 발생: ${error.message}`;
|
||||
}
|
||||
}
|
||||
|
||||
// 페이지 로드 시 콜백 처리
|
||||
handleCallback();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue