주뇽's 저장소

웹 애플리케이션에서 사용자를 인증하기 위해 토큰 기반 인증을 사용한다. 이때 액세스 토큰과 리프레쉬 토큰을 활용하여 보다 안전하고 효율적인 인증 시스템을 구축할 수 있다. 이 글에서는 리프레쉬 토큰의 필요성과 이를 활용한 액세스 토큰 재발급 방법을 상세히 설명한다. 1. 리프레쉬 토큰의 필요성액세스 토큰은 사용자가 인증된 상태임을 나타내는 짧은 수명의 토큰이다. 이는 서버에 부담을 주지 않고 빠른 인증을 가능하게 하지만, 짧은 수명으로 인해 자주 만료될 수 있다. 액세스 토큰이 만료될 때마다 사용자를 다시 로그인시키는 것은 매우 불편하다. 이를 해결하기 위해 리프레쉬 토큰을 사용한다.리프레쉬 토큰은 더 긴 수명을 가지며, 만료된 액세스 토큰을 재발급받을 수 있는 권한을 부여한다. 리프레쉬 토큰을 사용하면..

JavaScript XML(JSX) - HTML 보다 엄격함 - 닫는 태그가 필수 - 하나의 최상위 태그만 있어야 함 - Babel 덕분에 리액트 프로젝트에 사용 가능 - JSX -> JS 로 변환 - 괄호를 사용하면 JSX값을 반환하기 쉬움 return () - 컴포넌트 이름은 대문자로 - className을 사용 모든 컴포넌트는 components 폴더 아래 각각 저장하는게 모범 사례 components - FirstComponents.jsx - SecondComponents.jsx ... 각각 jsx 파일로 만들 때는 export를 해줘야 다른 경로에서 사용 가능 당연하게 사용하고자 하는 위치에서는 import 해야한다. export default function FirstComponent(){ r..

본 정리는 인프런 John Ahn 따라하며 배우는 노드, 리액트 시리즈 - 기본 강의를 참고하였습니다. 전체 흐름도 로그아웃은 이미 로그인이 되어있으므로 해당 유저 데이터베이스에서 토큰만 삭제하면 됨 index.js 파일에 다음 코드 추가 app.get('/api/users/logout', auth, (req, res) =>{ User.findOneAndUpdate({_id:req.user._id,}, {token :""}, (err,user)=>{ if(err) return res.json({ success : false, err, }) return res.status(200).send({success:true}) }) }) 포스트맨에서 로그인 후 로그아웃 확인 데이터베이스에서 토큰 삭제 확인 로그아웃..

본 정리는 인프런 John Ahn 따라하며 배우는 노드, 리액트 시리즈 - 기본 강의를 참고하였습니다. 전체 흐름도 페이지별로 로그인 또는 관리자 확인 필요한경우 체크하기 위해서 서버는 토큰을 데이터베이스에 저장되어 있음 클라이언트는 토큰을 쿠키에 저장되어 있음 인증을 위해서는 중간에 인증처리를 해줄 미드웨어가 필요 middleware/auth.js 파일 생성 후 다음 코드 추가 const {User} = require("../Models/User");// 미리 정의했던 모델 가져오기 const { request } = require("express"); let auth = (req, res, netx) =>{ //인증 처리를 하는 곳 // 1. 클라이언트에서 토큰을 가져옴 let token = req...

본 정리는 인프런 John Ahn 따라하며 배우는 노드, 리액트 시리즈 - 기본 강의를 참고하였습니다. 전체 흐름도 요청된 이메일을 데이터베이스에서 찾기 //몽고DB에서 제공하는 find함수 사용 // 1. 요청된 이메일을 데이터베이스에서 찾기 User.findOne({email: req.body.email}, (err, user)=>{ if(!user){ return res.json({ loginSuccess : false, massage : "제공된 이메일에 해당하는 유저가 없음" }) } 요청된 이메일이 있다면 비밀번호 체크 // Model/User.js userSchema.methods.comparePassword = function(plainPassword,callbackfunk) { // pl..

본 정리는 인프런 John Ahn 따라하며 배우는 노드, 리액트 시리즈 - 기본 강의를 참고하였습니다. 현재 비밀번호는 데이터베이스에 그대로 노출되기 때문에 관리해야함 다음명령어로 bycrypt 설치 npm install bcrypt --save Bycrypt로 비밀번호 암호화 하는 순서 먼저 Register Route에서 save하기전 (index.js) 유저 정보들을 데이터 베이스에 저장하기 전 암호화 Salt salt를 생성하고 이용해서 비밀번호를 암호화 Models/User.js 파일 수정 전체 코드 const mongoose = require('mongoose'); const bcrypt = require('bcrypt'); const saltRounds = 10; // 10자리를 이용하여 생성..

본 정리는 인프런 John Ahn 따라하며 배우는 노드, 리액트 시리즈 - 기본 강의를 참고하였습니다. MongoDB url은 배포시 숨겨야 함 2개의 다른 환경에서 개발 config 폴더 생성 dev.js 파일 생성 후 다음 코드 작성 module.exports ={ mongoURI:'mongodb+srv://Jun:zxc123@junprojcet.kzx4jm1.mongodb.net/?retryWrites=true&w=majority' } prod.js 파일 생성 후 다음 코드 작성 module.exports = { mongoURI : process.env.MONOG_URI } //헤로쿠의 경우 key.js 파일 생성 후 다음 코드 작성 if(process.env.NODE_ENV === 'product..

본 정리는 인프런 John Ahn 따라하며 배우는 노드, 리액트 시리즈 - 기본 강의를 참고하였습니다. 서버를 재시작하지 않아도 변경이 되면 자동으로 해주는 도구 다음 명령어를 이용하여 설치 패키지에서 dev의존성 추가 확인 가능 npm install nodemon --save-dev # dev를 쓰면 개발모드(로컬)에서만 사용 추가 스크립트 작성npm run backend 명령어로 실행 후 확인 "backend": "nodemon index.js", // nodemon을 이용하여 시작함