함께 알아가는 IT 정보

세션 관리와 로그아웃으로 넘어가면 된다!일단 세션 관리는 잘 된다. // 세션 관리 설정 // OAuth2 로그인 설정 .oauth2Login(oauth2 -> oauth2 .loginPage("/usr/member/login") .successHandler(oAuth2AuthenticationSuccessHandler) // 로그인 성공 후 핸들러 .defaultSuccessUrl("/usr/home/main", true) .failureUrl("/usr/mem..

뭔가 좀 꽃히면 뒤도 안돌아보고 돌진하는 스타일이라 다 만들어 놓고 깨달았는데 OAuto2부터 인증 받고 JWT를 해야되는데 이거 망한건 아닌가 잘 모르겠네;;여튼 간에 어떤 방식인지 정리부터 필요할 것 같다.사족이긴 한데 이미한걸 뭐 어떡하겠냐 일단 넣어봐야지.JWT와 OAuto2인증을 함께 사용할 때 장점OAuth2를 통해 외부 제공자의 인증을 신뢰할 수 있고,JWT를 통해 이후 요청에 대해 별도의 인증 절차 없이 사용자 인증이 가능합니다.서버가 세션을 관리할 필요가 없으니 Stateless 환경에서 유리합니다.근데 생각해보면 내 사이트는 Stateless하지는 않을 것 같단 말이지? 그럼 보안 강화를 목적에 두고 로그인을 할 때 만 JWT와 OAuto2 인증 둘 다 사용하고 이후에는 JWT는 버리고..

로컬 로그인 Session 문제 여전히 해결 안됐다.이건 내 능력 밖이라고 생각하고 그냥 버리려고 한다.소셜로그인만 사용해도 별 문제 없으니까..회원가입 페이지가 조금 아깝긴한데 그냥 버리자 이러다가 아무것도 진행못할 것 같다.그렇게 결단을 내리고,여태까지 쌓아왔던 클래스들을 지우니 마음이 좀 아팠다.(사실 속 시원했다)삭제한 클래스MemberController > doJoin - join - doLocalLogin - logout 메서드CustomUserDetails : 로컬 로그인 시 사용자의 인증 정보를 담았던 클래스CustomUserDetailsService : CustomUserDetails를 기반으로 사용자 정보를 조회하고 로컬 인증을 처리하던 서비스 클래스CustomLoginFilter : ..

이제 동시에 여러 계정이 로그인 되는 것을 막을 필요가 있었다. 기존에 사용하던 rq가 정상 작동 하지 않는 것을 보고 알아보니까이제는 security가 모든 것을 담당하게 되었다는 것을 알게되었다. 그래서 얘가 세션을 관리하게끔도 만들어줘야한다.일단은 해당 정보를 알았으니, 기본 세션 설정 코드를 시큐리티 클래스에 추가해줬다. // 세션 관리 설정 .sessionManagement(session -> session .sessionFixation().migrateSession() // 세션 고정 보호 (로그인 시 세션 새로 생성) .maximumSessions(1) ..

웹 페이지는 특유의 깜빡거림이 존재하는데 모바일 앱들은 보통 부드럽고 빠르게 동작한다.리액트는 모바일 앱 동작과 같은 웹을 만들 수 있고, 고품질의 웹, 복잡한 UI를 가진 앱도 깔끔하게 제작이 가능하다.물론 모바일 앱도 제작 가능하다.JS 라이브러리 중 하나. 사용자 인터페이스를 만들기 위해 사용됨.react 자습서 참고.console.clear();import React, { useState } from "https://cdn.skypack.dev/react@18";import ReactDOM from "https://cdn.skypack.dev/react-dom@18";const App = () => { //jsx (js안에서 html 작성가능.) return ( 안녕 ..

전 포스팅에서 구글 로그인 자체는 성공했다. firebase에서 인증을 통과 받았다는 뜻. 콘솔에서는 구글계정에서 받아온 데이터가 확실히 남은 것을 확인했으니 이제 이 데이터를 JAVA 프로젝트로 보내주면 된다.// 로그인 성공 후 사용자 이메일을 가져와서 서버로 요청을 보내는 코드onAuthStateChanged(window.auth, (user) => { if (user) { const email = user.email; // 서버로 Firebase 유저 정보를 요청 fetch(`/firebaseUser?email=${email}`) .then(response => response.text()) .then(data =>..

이제 진짜 본론으로 드디어 도달할 수 있게 되었다.일단 내가 생각했을 때, 구글로그인을 구현해가는 방법이나 순서를 생각의 흐름대로 나열해보자.Thinking Flow난 로컬 유저와 소셜유저를 아예 나눌 생각이다. 그래서 이메일로 로그인하게끔 만든거고, 테이블의 소셜 두개를 따로 둬서 해당 두개의 값이 다 null이라면 로컬인거고 둘 중 하나가 채워져있다면 소셜로그인인것. 두개는 스포티파이와 구글이다. 일단 난 구글에 집중해야되니, 스포티파이는 빼놓자고.그렇다면 어떻게 해야할까. 소셜로그인의 작동 방식은 조금만 생각해도 유추가 된다. 일단은 로그인 시도, 일치하는 정보가 없다? 그러면 바로 회원가입을 자동으로 처리 이후에 다시 로그인을 시켜준다. 이게 일반적인 소셜로그인의 방식일 것이다.그럼 이제 대충 그..

자 이제 정보를 firebase에 가져오는 것 까지 성공했으니, 내 프로젝트까지 이 데이터를 받아와서 가공하고 사용해야되는 단계다.OAuto2 인증을 사용할거고, 처음엔 다들 하니까 이유가 있겠거니 였는데 이런식으로 접근하면 안되고 이유를 명확히 알아냈다.크게 딱 두가지인데 보안과 편의성 때문이다. 가져온 정보를 리소스를 통해서 직접적으로 보는게 아닌 간접적으로 가져올 수 있기 때문이다.편의성을 위해 또 돌아가야한다니 아이러니하다..아무튼 한번 해보자.앞서 한번 더 말하는데 일단 해보는거라 정답이 아닐 확률이 굉장히 높다 흐름만 봐라..나중에 성공하면 어떻게 했는지 올리겠다.일단 의존성 추가가 제일 처음 해야할 일이다. org.springframework.boot spring-boot-star..

OAuto2 인증을 도입하던 와중에 GPT를 고문하다가 좋을 걸 알아냈다.내 프로젝트는 지금 Mybatis로 직접 내가 쿼리를 다 써서 날리고 있는데 세상에 JPA를 사용하면 쿼리를 알아서 자동으로 날려준다는게 아닌가?바로 적용해봐야지 ㅋㅋ일단은 의존성부터 다시 설정을 하는데, Mybatis 관련 의존성은 지우고, JPA를 도입해주면 된다. 검색하면 나오니까 자기 프로젝트에 맞게 알아서들 하십쇼. 그리고 어플리케이션.yml도 JPA를 사용할 수 있게 수정해줘야한다!이후 난 VO 폴더에서 Member 클래스로 데이터를 전달했는데 이를 JPAentity패키지로 새로 만들어서 객체로 전달했다. 뭐 거의 비슷한데 어노테이션이 조금 추가 된 정도다.@Entity@Table(name = "users") // DB..

이제 진짜 준비준비는 끝이고 구현시작이다.뭐가 어떻게 돌아가는지 생각하지 말고 사용방법만 익히자. 어차피 이해는 못한다.이걸 가슴에 담고 만들어보도록 하자.일단 우리가 복붙해온 코드구조를 보면 // Import the functions you need from the SDKs you needimport { initializeApp } from "firebase/app";import { getAnalytics } from "firebase/analytics";// TODO: Add SDKs for Firebase products that you want to use// https://firebase.google.com/docs/web/setup#available-libraries아마 이렇게 되어있을텐데 이..