Jin's Dev Story

[Spring Security] 카카오 로그인 실습 - Web 본문

Web & Android/Spring Security

[Spring Security] 카카오 로그인 실습 - Web

woojin._. 2023. 10. 19. 10:08

참고 링크

Spring Boot를 이용해 카카오 로그인 만들기 (프로젝트 첫 생성부터 구현까지)

1. 링크 실행

https://developers.kakao.com/console/app

 

카카오계정

 

accounts.kakao.com

2. 애플리케이션 추가

3. 앱 이름, 사업자명 등록

4. 추가된 애플리케이션 클릭 → 플랫폼 등록

  • Android, iOS, Web 중 필요한 플랫폼 등록
  • Web

5. 추가한 애플리케이션 클릭 → 앱 키 → REST API 키 복사 (나중에 사용 예정)

6. 메뉴바에서 카카오 로그인 클릭

 

7. 카카오 로그인 프론트 페이지

https://developers.kakao.com/docs/latest/ko/kakaologin/rest-api

 

Kakao Developers

카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다.

developers.kakao.com

8. 리소스 다운로드 클릭 → 다운로드(.png) 클릭

 

  • resources/static/img 경로에 다운 받은 이미지 삽입

9. mavenrepository 링크 접속 후 의존성 주입

https://mvnrepository.com/artifact/com.google.code.gson/gson/2.10.1

 

10. templates 경로에 html 추가

<body>
    <h1>Kakao Login Test</h1>
    <span th:if="${userId == null}">
        <a href="https://kauth.kakao.com/oauth/authorize?response_type=code&client_id=REST_API_KEY&redirect_uri=REDIRECT_URI">
            <img src = "img/kakao_login_medium_narrow.png">
        </a>
    </span>
    <span th:if="${userId != null}">
        <form name="logout" action="http://localhost:8088/logout">
            <input type="submit" value="로그아웃">
        </form>
    </span>
</body>

 

11. application.properties에 코드 추가

spring.thymeleaf.prefix=classpath:templates/
spring.thymeleaf.check-template-location=true
spring.thymeleaf.suffix=html
spring.thymeleaf.mode=HTML5
spring.thymeleaf.cache=false
spring.thymeleaf.template-resolver-order=0

12. springboot 실행하면 해당 화면처럼 보일 예정

13. Controller & KakaoAPI 클래스 추가

  • Controller
package com.example.kakao_login_test;

import jakarta.servlet.http.HttpSession;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.servlet.ModelAndView;

import java.util.HashMap;

@RestController
public class HomeController {

    KakaoAPI kakaoAPI = new KakaoAPI();

    @RequestMapping("/login")
    public ModelAndView login(@RequestParam("code") String code, HttpSession session) {
        ModelAndView mav = new ModelAndView();

        // 1. 인증코드 요청 전달
        String access_token = kakaoAPI.getAccessToken(code);

        // 2. 인증코드로 토큰 전달
        HashMap<String, Object> userInfo = kakaoAPI.getUserInfo(access_token);

        System.out.println("login info : " + userInfo.toString());

        if(userInfo.get("email") != null) {
            session.setAttribute("userId", userInfo.get("email"));
            session.setAttribute("accessToken", access_token);
        }

        mav.addObject("userId", userInfo.get("email"));
        mav.setViewName("index");
        return mav;
    }

    @RequestMapping("/logout")
    public ModelAndView logout(HttpSession session) {
        ModelAndView mav = new ModelAndView();

        kakaoAPI.kakaoLogout((String) session.getAttribute("accessToken"));
        session.removeAttribute("accessToken");
        session.removeAttribute("userId");
        mav.setViewName("index");

        return mav;
    }
}

 

  • KakaoAPI

→ https://kapi.kakao.com/v2/user/me 복사

→ https://kauth.kakao.com/oauth/token 복사

 

  • JavaScript 키

  • redirect_url → 전에 설정한 로그인 경로
package com.example.kakao_login_test;

import com.google.gson.JsonElement;
import com.google.gson.JsonObject;
import com.google.gson.JsonParser;

import java.io.*;
import java.net.HttpURLConnection;
import java.net.MalformedURLException;
import java.net.ProtocolException;
import java.net.URL;
import java.util.HashMap;

public class KakaoAPI {

    public String getAccessToken(String code) {
        String accessToken = "";
        String refreshToken = "";
        String reqURL = "https://kauth.kakao.com/oauth/token";

        try {
            URL url = new URL(reqURL);
            HttpURLConnection conn = (HttpURLConnection) url.openConnection();
            conn.setRequestMethod("POST");
            conn.setDoOutput(true);

            BufferedWriter bw = new BufferedWriter(new OutputStreamWriter(conn.getOutputStream()));
            StringBuilder sb = new StringBuilder();
            sb.append("grant_type=authorization_code");
            sb.append("&client_id=JavaScript키");
            sb.append("&redirect_url=앞에서 추가한 redirect_url 추가");
            sb.append("&code=" + code);

            bw.write(sb.toString());
            bw.flush();

            int responseCode = conn.getResponseCode();
            System.out.println("response code = " + responseCode);

            BufferedReader br = new BufferedReader(new InputStreamReader(conn.getInputStream()));

            String line = "";
            String result = "";
            while((line = br.readLine()) != null) {
                result += line;
            }
            System.out.println("response body = " + result);

            JsonParser parser = new JsonParser();
            JsonElement element = parser.parse(result);

           accessToken = element.getAsJsonObject().get("access_token").getAsString();
           refreshToken = element.getAsJsonObject().get("refresh_token").getAsString();

           br.close();
           bw.close();
        } catch (Exception e) {
            e.printStackTrace();
        }
        return accessToken;
    }

public HashMap<String, Object> getUserInfo(String accessToken) {
        HashMap<String, Object> userInfo = new HashMap<String, Object>();
        String reqUrl = "https://kapi.kakao.com/v2/user/me";

        try {
            URL url = new URL(reqUrl);
            HttpURLConnection conn = (HttpURLConnection) url.openConnection();
            conn.setRequestMethod("POST");
            conn.setRequestProperty("Authorization", "Bearer " + accessToken);
            int responseCode = conn.getResponseCode();
            System.out.println("responseCode" + responseCode);

            BufferedReader br = new BufferedReader(new InputStreamReader(conn.getInputStream()));

            String line = "";
            String result = "";

            while((line = br.readLine()) != null) {
                result += line;
            }
            System.out.println("response body =" + result);

            JsonParser parser = new JsonParser();
            JsonElement element = parser.parse(result);

            JsonObject properties = element.getAsJsonObject().get("properties").getAsJsonObject();
            JsonObject kakaoAccount = element.getAsJsonObject().get("kakao_account").getAsJsonObject();

            String nickname = properties.getAsJsonObject().get("nickname").getAsString();
            String email = kakaoAccount.getAsJsonObject().get("email").getAsString();

            userInfo.put("nickname", nickname);
            userInfo.put("email", email);
        } catch (Exception e) {
            e.printStackTrace();
        }
        return userInfo;
    }

    public void kakaoLogout(String accessToken) {
        String reqURL = "https://kapi.kakao.com/v1/user/logout";
        try {
            URL url = new URL(reqURL);
            HttpURLConnection conn = (HttpURLConnection) url.openConnection();
            conn.setRequestMethod("POST");
            conn.setRequestProperty("Authorization", "Bearer " + accessToken);
            int responseCode = conn.getResponseCode();
            System.out.println("responseCode = " + responseCode);

            BufferedReader br = new BufferedReader(new InputStreamReader(conn.getInputStream()));

            String line = "";
            String result = "";

            while((line = br.readLine()) != null) {
                result += line;
            }
            System.out.println(result);

        } catch (Exception e) {
            e.printStackTrace();
        }
    }
}

14. 동의 항목 설정

  • 필요한 항목들 동의 항목 설정

https://developers.kakao.com/console/app/967025/product/login/scope

 

카카오계정

 

accounts.kakao.com

15. 로그인/로그아웃 성공

  • 에러 날 경우 참고할 페이지

https://developers.kakao.com/docs/latest/ko/kakaologin/trouble-shooting

 

Kakao Developers

카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다.

developers.kakao.com

 

 

            •  
저작자표시 비영리 변경금지

'Web & Android > Spring Security' 카테고리의 다른 글

[Spring Security] SNS 로그인  (0) 2023.10.19
[Spring Security] OAuth 2.0을 이용한 인증  (0) 2023.10.19
[Spring Security] Access Token+ Refresh Token을 이용한 인증  (1) 2023.10.19
[Spring Security] Access Token을 이용한 인증  (0) 2023.10.19
[Spring Security] 세션과 쿠키를 이용한 인증  (0) 2023.10.17
'Web & Android/Spring Security' Related Articles more