[ STUDY ] 87

[ 알아보자 ] React랑 Node.js(?)

ReactReact는 우리가 웹 애플리케이션을 만들 때 사용하는 프론트엔드 라이브러리로, UI를 효율적으로 구성해준다. 우리가 React 앱을 만들 때 단순히 브라우저에서 코드가 실행되는 것이 아니라, Node.js 기반의 개발 환경이 필요하다. Node.jsReact 앱을 만들 때, Node.js기반의 개발 환경이 필요하다. 1. 로컬 개발 서버 제공 React 프로젝트를 만들고 npm run start 명령어를 실행하면, Node.js가 로컬 환경에서 웹 서버를 실행한다.이 서버는 localhost:3000에서 동작함. 기능실시간으로 React코드를 브라우저에 표시코드 변경 시에 자동으로 페이지 새로고침API요청 프록시 등 개발에 필요한 기능 제공 2. 개발 도구 및 편의성 제공npm(Node Pac..

[ JWT를 활용한 Spring Security ] Refresh Token?Access Token?

Refresh Token?유효기간이 길다Access Token이 만료되어 갱신될 때만 사용한다.재발급에 관여하는 토큰 Access Token?유효기간이 짧다API 통신에 사용된다.접근에 관여하는 토큰 왜 이렇게 토큰을 두개로 나눌까?JWT는 탈취의 위험성이 있다!!토큰을 탈취당하면 탈취한 사람이 특정 권한에 대한 인증을 통과할 수도 있다....서버는 실제 주인과 탈취한 사람을 구분 못함그래서 토큰의 유효기간을 짧게 두는게 보안상 좋은데 유효기간이 짧으면 유효시간마다 로그인을 다시해야한다.이런 문제를 해결하기 위해 Access Token과 Refresh Token을 나눠두는 것!  토큰 발급과 인증 방식1. 로그인시에 서버가 Access Token과 Refresh Token을 동시에 발급2. 서버는 Ref..

[ JWT를 활용한 Spring Security ] JWT 토큰 생성

JWT? Json Web Token의 줄임말로 JSON 객체를 사용해 정보를 안전하게 전송하는 토큰 기반 인증 방식 Stateless 방식으로 서버가 클라이언트의 상태를 저장하지 않고, 클라이언트가 요청을 보낼때 제공한 JWT를 기반으로 인증을 처리무상태(stateless): 클라이언트와 서버 관계에서 서버가 클라이언트의 상태를 보존하지 않음을 의미장점 - 특정 DB/서버에 의존하지 않아도 인증 가능- 서버의 확장성이 높기 때문에 대량의 트래픽 발생 시에도 대처가 수월단점  - 클라이언트의 요청에 상대적으로 Stateful 보다 더 많은 데이터가 소모- 데이터 노출로 인한 보안적인 문제사용자 인증, 정보 교환에 사용유효 기간과 서명을 포함하여 변조되지 않았음을 보장 ⬇️⬇️ Stateless의 반대는??..

[ JWT를 활용한 Spring Security ] JWT토큰 인증 과정

JwtRequestFilter란?JwtRequestFilter는 JWT 토큰을 이용해 사용자를 인증하는 스프링 시큐리티 필터클라이언트가 서버에 API 요청을 보낼 때마다 이 필터가 실행되어 Authorization 헤더에 포함된 JWT 토큰을 검증 JwtRequestFilter는 클라이언트가 제공한 토큰이 유효한지 확인하고, 유효하다면 사용자의 인증 정보를 SecurityContext에 저장하여 인증 상태를 유지한다. JWT 토큰 인증 과정 1. 요청의 Authorization 헤더에서 JWT 토큰 추출final String authorizationHeader = request.getHeader("Authorization");if (authorizationHeader != null && authoriza..

[ JWT를 활용한 Spring Security ] 파일 설명

사실 Security를 이해하고 코드를 짠게 아니라서 다시 정리하면서 리팩토링해보려구 한다.....우선 각 파일에 대해서 먼저 정리함! LoginController사용자가 이메일과 비밀번호를 입력하여 인증을 시도하면, 이를 검증한 후 JWT 토큰을 발급하는 API@PostMapping("/login")public ResponseEntity getToken(@RequestBody AccountCredentialsDTO accountCredentials) { try { // UsernamePasswordAuthenticationToken을 사용해 이메일과 비밀번호로 인증 객체 생성 UsernamePasswordAuthenticationToken creds = new Userna..

[Flutter] Dart언어

특징main()함수로 시작어디에서나 변수선언, 사용 가능모든 변수가 객체, 모든 객체는 object클래스 상속받음dynamic타입 이용(dynamic : 여러 자료형 허용)외부로 노출하고 싶지 않을 경우 변수나 함수 앞에 언더스코어(_) 사용제네릭타입을 사용해 개발 가능null safety wldnjs : 컴파일 전 널 예외(null exeption)을 알 수 있음 -> null에 대한 오류가 발생하지 않도록 작업 가능  VARIABLESfinal : javascript의 const역할const : compile-time constant(compile-time에 알고 는 값이어야 함) API에서 받아야하는 변수 값은 Xlate : final이나 var앞에 붙이는 수식어 : 초기 데이터 없이 변수 선언 가..