From 9996f5e35e86a98882b7c52295bdf6dfdcba2812 Mon Sep 17 00:00:00 2001
From: nam <yhnham@gmail.com>
Date: Fri, 17 Jan 2025 20:26:19 +0900
Subject: [PATCH] =?UTF-8?q?jwt=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 build.gradle                                  |   3 +-
 .../com/example/digger/user/UserService.java  |  10 +-
 src/main/resources/static/css/home.css        | 109 ---------
 src/main/resources/static/css/login.css       |   0
 src/main/resources/static/css/register.css    |   0
 src/main/resources/templates/base.html        |  53 -----
 src/main/resources/templates/home.html        | 209 ------------------
 src/main/resources/templates/login.html       | 117 ----------
 src/main/resources/templates/register.html    | 111 ----------
 9 files changed, 6 insertions(+), 606 deletions(-)
 delete mode 100644 src/main/resources/static/css/home.css
 delete mode 100644 src/main/resources/static/css/login.css
 delete mode 100644 src/main/resources/static/css/register.css
 delete mode 100644 src/main/resources/templates/base.html
 delete mode 100644 src/main/resources/templates/home.html
 delete mode 100644 src/main/resources/templates/login.html
 delete mode 100644 src/main/resources/templates/register.html

diff --git a/build.gradle b/build.gradle
index 610589d..6022d3c 100644
--- a/build.gradle
+++ b/build.gradle
@@ -35,11 +35,10 @@ dependencies {
 	testRuntimeOnly 'org.junit.platform:junit-platform-launcher'
 
 	// Spring Security
-	implementation 'org.springframework.security:spring-security-crypto'
 	implementation 'org.springframework.boot:spring-boot-starter-security'
 	testImplementation 'org.springframework.security:spring-security-test'
 
-	// JWT Token
+	// JWT
 	implementation 'io.jsonwebtoken:jjwt-api:0.11.5'
 	implementation 'io.jsonwebtoken:jjwt-impl:0.11.5'
 	implementation 'io.jsonwebtoken:jjwt-jackson:0.11.5'
diff --git a/src/main/java/com/example/digger/user/UserService.java b/src/main/java/com/example/digger/user/UserService.java
index a8e80d4..442b1e5 100644
--- a/src/main/java/com/example/digger/user/UserService.java
+++ b/src/main/java/com/example/digger/user/UserService.java
@@ -52,11 +52,7 @@ public Map<String, String> login(String email, String password) {
         // 리프레시 토큰 저장
         refreshTokenStore.put(email, refreshToken);
 
-        Map<String, String> tokens = new HashMap<>();
-        tokens.put("accessToken", accessToken);
-        tokens.put("refreshToken", refreshToken);
-
-        return tokens;
+        return Map.of("accessToken", accessToken, "refreshToken", refreshToken);
     }
 
     public String refreshAccessToken(String email, String refreshToken) {
@@ -66,6 +62,10 @@ public String refreshAccessToken(String email, String refreshToken) {
             throw new RuntimeException("리프레시 토큰이 유효하지 않습니다.");
         }
 
+        if (!jwtTokenProvider.validateToken(refreshToken)) {
+            throw new RuntimeException("리프레시 토큰이 만료되었습니다.");
+        }
+
         // 새 액세스 토큰 발급
         return jwtTokenProvider.generateAccessToken(email);
     }
diff --git a/src/main/resources/static/css/home.css b/src/main/resources/static/css/home.css
deleted file mode 100644
index c21b9b8..0000000
--- a/src/main/resources/static/css/home.css
+++ /dev/null
@@ -1,109 +0,0 @@
-body {
-    font-family: 'Noto Sans KR', sans-serif;
-    line-height: 1.6;
-    margin: 0;
-    padding: 0;
-    background-color: #f4f4f4;
-}
-.container {
-    width: 80%;
-    margin: 0 auto;
-    overflow: hidden;
-}
-header {
-    background: #333;
-    color: #fff;
-    padding-top: 30px;
-    min-height: 70px;
-    border-bottom: #bbb 1px solid;
-}
-header a {
-    color: #fff;
-    text-decoration: none;
-    text-transform: uppercase;
-    font-size: 16px;
-}
-header ul {
-    padding: 0;
-    margin: 0;
-    list-style: none;
-    overflow: hidden;
-}
-header li {
-    float: left;
-    display: inline;
-    padding: 0 20px 0 20px;
-}
-header #branding {
-    float: left;
-}
-header #branding h1 {
-    margin: 0;
-}
-header nav {
-    float: right;
-    margin-top: 10px;
-}
-header .highlight, header .current a {
-    color: #e8491d;
-    font-weight: bold;
-}
-header a:hover {
-    color: #ffffff;
-    font-weight: bold;
-}
-#showcase {
-    min-height: 400px;
-    background: url('https://source.unsplash.com/random/1600x900/?music') no-repeat center center/cover;
-    text-align: center;
-    color: #ffffff;
-}
-#showcase h1 {
-    margin-top: 100px;
-    font-size: 55px;
-    margin-bottom: 10px;
-}
-#showcase p {
-    font-size: 20px;
-}
-#main {
-    float: left;
-    width: 70%;
-    padding: 0 30px;
-    box-sizing: border-box;
-}
-#sidebar {
-    float: right;
-    width: 30%;
-    background: #333;
-    color: #fff;
-    padding: 10px;
-    box-sizing: border-box;
-}
-article.post {
-    background: #fff;
-    margin-bottom: 20px;
-    padding: 20px;
-    border-radius: 5px;
-}
-footer {
-    background: #333;
-    color: #fff;
-    text-align: center;
-    padding: 20px;
-    margin-top: 20px;
-}
-@media(max-width: 768px) {
-    header #branding,
-    header nav,
-    header nav li,
-    #main,
-    #sidebar {
-        float: none;
-        text-align: center;
-        width: 100%;
-    }
-    header {
-        padding-bottom: 20px;
-    }
-}
\ No newline at end of file
diff --git a/src/main/resources/static/css/login.css b/src/main/resources/static/css/login.css
deleted file mode 100644
index e69de29..0000000
diff --git a/src/main/resources/static/css/register.css b/src/main/resources/static/css/register.css
deleted file mode 100644
index e69de29..0000000
diff --git a/src/main/resources/templates/base.html b/src/main/resources/templates/base.html
deleted file mode 100644
index e5c7ce8..0000000
--- a/src/main/resources/templates/base.html
+++ /dev/null
@@ -1,53 +0,0 @@
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org">
-<head>
-    <script>
-        const refreshToken = '[[${refreshToken}]]'; // 서버에서 전달된 리프레시 토큰
-        const email = '[[${email}]]'; // 사용자 이메일
-
-        function checkAndRefreshToken() {
-            fetch('/api/protected-endpoint', {
-                method: 'GET',
-                headers: {
-                    'Authorization': 'Bearer ' + localStorage.getItem('accessToken')
-                }
-            }).then(response => {
-                if (response.status === 401) { // 액세스 토큰이 만료됨
-                    refreshAccessToken();
-                }
-            }).catch(error => {
-                console.error('토큰 확인 중 오류 발생:', error);
-            });
-        }
-
-        function refreshAccessToken() {
-            fetch('/api/user/refresh-token', {
-                method: 'POST',
-                headers: {
-                    'Content-Type': 'application/x-www-form-urlencoded',
-                },
-                body: `email=${email}&refreshToken=${refreshToken}`
-            }).then(response => response.json())
-                .then(data => {
-                    localStorage.setItem('accessToken', data.accessToken); // 새 액세스 토큰 저장
-                    console.log("새로운 액세스 토큰 발급 완료:", data.accessToken);
-                })
-                .catch(error => console.error('리프레시 토큰 재발급 중 오류 발생:', error));
-        }
-
-        // 페이지 로드 시 또는 주기적으로 토큰 확인
-        setInterval(checkAndRefreshToken, 5 * 60 * 1000); // 5분마다 확인
-    </script>
-</head>
-<body>
-<header>
-    <!-- 헤더 공통 영역 -->
-</header>
-<main>
-    <div th:insert="~{::body}"></div>
-</main>
-<footer>
-    <!-- 푸터 공통 영역 -->
-</footer>
-</body>
-</html>
diff --git a/src/main/resources/templates/home.html b/src/main/resources/templates/home.html
deleted file mode 100644
index 77f1823..0000000
--- a/src/main/resources/templates/home.html
+++ /dev/null
@@ -1,209 +0,0 @@
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org" lang="ko">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>음악 커뮤니티 - 홈</title>
-    <style>
-        body {
-            font-family: 'Noto Sans KR', sans-serif;
-            line-height: 1.6;
-            margin: 0;
-            padding: 0;
-            background-color: #f4f4f4;
-        }
-        .container {
-            width: 80%;
-            margin: 0 auto;
-            overflow: hidden;
-        }
-        header {
-            background: #333;
-            color: #fff;
-            padding-top: 30px;
-            min-height: 70px;
-            border-bottom: #bbb 1px solid;
-        }
-        header a {
-            color: #fff;
-            text-decoration: none;
-            text-transform: uppercase;
-            font-size: 16px;
-        }
-        header ul {
-            padding: 0;
-            margin: 0;
-            list-style: none;
-            overflow: hidden;
-        }
-        header li {
-            float: left;
-            display: inline;
-            padding: 0 20px 0 20px;
-        }
-        header #branding {
-            float: left;
-        }
-        header #branding h1 {
-            margin: 0;
-        }
-        header nav {
-            float: right;
-            margin-top: 10px;
-        }
-        header .highlight, header .current a {
-            color: #e8491d;
-            font-weight: bold;
-        }
-        header a:hover {
-            color: #ffffff;
-            font-weight: bold;
-        }
-        #showcase {
-            min-height: 400px;
-            background: url('https://source.unsplash.com/random/1600x900/?music') no-repeat center center/cover;
-            text-align: center;
-            color: #ffffff;
-        }
-        #showcase h1 {
-            margin-top: 100px;
-            font-size: 55px;
-            margin-bottom: 10px;
-        }
-        #showcase p {
-            font-size: 20px;
-        }
-        #main {
-            float: left;
-            width: 70%;
-            padding: 0 30px;
-            box-sizing: border-box;
-        }
-        #sidebar {
-            float: right;
-            width: 30%;
-            background: #333;
-            color: #fff;
-            padding: 10px;
-            box-sizing: border-box;
-        }
-        article.post {
-            background: #fff;
-            margin-bottom: 20px;
-            padding: 20px;
-            border-radius: 5px;
-        }
-        footer {
-            background: #333;
-            color: #fff;
-            text-align: center;
-            padding: 20px;
-            margin-top: 20px;
-        }
-        @media(max-width: 768px) {
-            header #branding,
-            header nav,
-            header nav li,
-            #main,
-            #sidebar {
-                float: none;
-                text-align: center;
-                width: 100%;
-            }
-            header {
-                padding-bottom: 20px;
-            }
-        }
-    </style>
-</head>
-<body>
-<header>
-    <div class="container">
-        <div id="branding">
-            <h1>
-                <span class="highlight">Digger</span>
-            </h1>
-        </div>
-        <nav>
-            <ul>
-                <li class="current"><a href="/">홈</a></li>
-                <li><a href="/genres">장르</a></li>
-                <li><a href="/artists">아티스트</a></li>
-                <li><a href="/forum">포럼</a></li>
-                <li><a href="/about">소개</a></li>
-            </ul>
-        </nav>
-    </div>
-</header>
-
-<section id="showcase">
-    <div class="container">
-        <h1>Digger</h1>
-        <p>다양한 장르, 아티스트에 대해 이야기를 나누고 새로운 음악을 발견하세요.</p>
-    </div>
-</section>
-
-<div class="container">
-    <section id="main">
-        <h2>최근 게시물</h2>
-        <div th:each="post : ${recentPosts}">
-            <article class="post">
-                <h3 th:text="${post.title}">게시물 제목</h3>
-                <p th:text="${#strings.abbreviate(post.content, 200)}">게시물 내용...</p>
-                <small th:text="${#temporals.format(post.createdAt, 'yyyy-MM-dd HH:mm')}">작성일</small>
-                <a th:href="@{'/posts/' + ${post.id}}">더 보기</a>
-            </article>
-        </div>
-    </section>
-
-    <aside id="sidebar">
-        <h3>인기 태그</h3>
-        <ul>
-            <li th:each="tag : ${popularTags}">
-                <a th:href="@{'/tags/' + ${tag.name}}" th:text="${tag.name}">태그 이름</a>
-            </li>
-        </ul>
-        <h3>이번 주 인기 아티스트</h3>
-        <ul>
-            <li th:each="artist : ${popularArtists}">
-                <a th:href="@{'/artists/' + ${artist.id}}" th:text="${artist.name}">아티스트 이름</a>
-            </li>
-        </ul>
-    </aside>
-</div>
-
-<h1>환영합니다!</h1>
-<p>로그인 성공! 아래는 발급된 토큰입니다.</p>
-
-<h2>Access Token</h2>
-<textarea rows="5" cols="80" th:text="${accessToken}"></textarea>
-
-<h2>Refresh Token</h2>
-<textarea rows="5" cols="80" th:text="${refreshToken}"></textarea>
-
-<p>Access Token과 Refresh Token을 통해 인증 및 재인증이 가능합니다.</p>
-
-<script>
-    // Access Token과 Refresh Token 출력 (브라우저 콘솔에서 확인 가능)
-    const accessToken = '[[${accessToken}]]';
-    const refreshToken = '[[${refreshToken}]]';
-    console.log('Access Token:', accessToken);
-    console.log('Refresh Token:', refreshToken);
-</script>
-
-<footer>
-    <p>&copy; 2025 Side Project. All rights reserved.</p>
-</footer>
-
-<script th:inline="javascript">
-    /*<![CDATA[*/
-    const recentPosts = /*[[${recentPosts}]]*/ [];
-    const popularTags = /*[[${popularTags}]]*/ [];
-    const popularArtists = /*[[${popularArtists}]]*/ [];
-    console.log('Recent Posts:', recentPosts);
-    console.log('Popular Tags:', popularTags);
-    console.log('Popular Artists:', popularArtists);
-    /*]]>*/
-</script>
-</body>
-</html>
\ No newline at end of file
diff --git a/src/main/resources/templates/login.html b/src/main/resources/templates/login.html
deleted file mode 100644
index fd42273..0000000
--- a/src/main/resources/templates/login.html
+++ /dev/null
@@ -1,117 +0,0 @@
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>로그인</title>
-    <style>
-        body {
-            font-family: Arial, sans-serif;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            height: 100vh;
-            margin: 0;
-            background-color: #f0f2f5;
-        }
-        .login-container {
-            background-color: white;
-            padding: 2rem;
-            border-radius: 8px;
-            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-            width: 300px;
-        }
-        .form-group {
-            margin-bottom: 1rem;
-        }
-        .form-group label {
-            display: block;
-            margin-bottom: 0.5rem;
-        }
-        .form-group input {
-            width: 100%;
-            padding: 0.5rem;
-            border: 1px solid #ddd;
-            border-radius: 4px;
-        }
-        .btn {
-            display: block;
-            width: 100%;
-            padding: 0.75rem;
-            border: none;
-            border-radius: 4px;
-            cursor: pointer;
-            font-size: 1rem;
-            text-align: center;
-            text-decoration: none;
-            margin-bottom: 1rem;
-        }
-        .btn-primary {
-            background-color: #1877f2;
-            color: white;
-        }
-        .oauth-container {
-            display: flex;
-            justify-content: center;
-            gap: 10px;
-            margin-bottom: 1rem;
-        }
-        .btn-oauth {
-            width: 40px;
-            height: 40px;
-            border-radius: 4px;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            font-size: 0.8rem;
-            color: white;
-        }
-        .btn-google { background-color: #db4437; }
-        .btn-facebook { background-color: #4267B2; }
-        .btn-naver { background-color: #03C75A; }
-        .signup-link {
-            text-align: center;
-            font-size: 0.8rem;
-        }
-        h2 {
-            font-size: 2rem;
-            text-align: center;
-            margin-bottom: 1.5rem;
-        }
-    </style>
-</head>
-<body>
-<div class="login-container">
-    <h2>로그인</h2>
-    <form th:action="@{/api/user/login}" method="post">
-        <div class="form-group">
-            <label for="email">이메일:</label>
-            <input type="email" id="email" name="email" required placeholder="이메일 주소">
-        </div>
-        <div class="form-group">
-            <label for="password">비밀번호:</label>
-            <input type="password" id="password" name="password" required placeholder="비밀번호">
-        </div>
-
-        <!-- 에러 메시지 표시 -->
-        <div th:if="${error}" style="color: red; margin-top: 10px;">
-            <p th:text="${error}"></p>
-        </div>
-
-        <button type="submit" class="btn btn-primary">로그인</button>
-    </form>
-
-    <div class="oauth-container">
-        <a th:href="@{/oauth2/authorization/google}" class="btn-oauth btn-google">G</a>
-        <a th:href="@{/oauth2/authorization/facebook}" class="btn-oauth btn-facebook">F</a>
-        <a th:href="@{/oauth2/authorization/naver}" class="btn-oauth btn-naver">N</a>
-    </div>
-
-
-    <div class="signup-link">
-        <a th:href="@{/api/user/register}">회원가입</a>
-    </div>
-</div>
-</body>
-</html>
-
diff --git a/src/main/resources/templates/register.html b/src/main/resources/templates/register.html
deleted file mode 100644
index e2c1717..0000000
--- a/src/main/resources/templates/register.html
+++ /dev/null
@@ -1,111 +0,0 @@
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>회원가입</title>
-    <style>
-        body {
-            font-family: Arial, sans-serif;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            height: 100vh;
-            margin: 0;
-            background-color: #f0f2f5;
-        }
-        .signup-container {
-            background-color: white;
-            padding: 2rem;
-            border-radius: 8px;
-            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-            width: 300px;
-        }
-        .form-group {
-            margin-bottom: 1rem;
-        }
-        .form-group label {
-            display: block;
-            margin-bottom: 0.5rem;
-        }
-        .form-group input {
-            width: 100%;
-            padding: 0.5rem;
-            border: 1px solid #ddd;
-            border-radius: 4px;
-        }
-        .btn {
-            display: block;
-            width: 100%;
-            padding: 0.75rem;
-            border: none;
-            border-radius: 4px;
-            cursor: pointer;
-            font-size: 1rem;
-            text-align: center;
-            text-decoration: none;
-            margin-bottom: 1rem;
-        }
-        .btn-primary {
-            background-color: #1877f2;
-            color: white;
-        }
-        .oauth-container {
-            display: flex;
-            justify-content: center;
-            gap: 10px;
-            margin-bottom: 1rem;
-        }
-        .btn-oauth {
-            width: 40px;
-            height: 40px;
-            border-radius: 4px;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            font-size: 0.8rem;
-            color: white;
-        }
-        .login-link {
-            text-align: center;
-            font-size: 0.8rem;
-        }
-        h2 {
-            font-size: 2rem;
-            text-align: center;
-            margin-bottom: 1.5rem;
-        }
-    </style>
-</head>
-<body>
-<div class="signup-container">
-    <h2>회원가입</h2>
-    <form th:action="@{/api/user/register}" method="post">
-        <div class="form-group">
-            <label for="email">이메일:</label>
-            <input type="email" id="email" name="email" required placeholder="이메일 주소">
-        </div>
-        <div class="form-group">
-            <label for="name">이름:</label>
-            <input type="text" id="name" name="name" required placeholder="이름">
-        </div>
-        <div class="form-group">
-            <label for="password">비밀번호:</label>
-            <input type="password" id="password" name="password" required placeholder="비밀번호">
-        </div>
-
-        <!-- 에러 메시지 표시 -->
-        <div th:if="${error}" style="color: red; margin-top: 10px;">
-            <p th:text="${error}"></p>
-        </div>
-
-        <button type="submit" class="btn btn-primary">회원가입</button>
-    </form>
-
-    <div class="login-link">
-        이미 계정이 있으신가요? <a th:href="@{/api/user/login}">로그인</a>
-    </div>
-</div>
-</body>
-</html>
-