TIL 25일차(2) (20240129)

..62시간짜리 강의 정리본..
회고하는 동안 꿀팁을 들었다. ⭐ 개인과제때 쓸 패키지 미리 정리하기!

로그인, 회원가입 API

✏️ users.router.js에 import해야하는 것

import express from 'express';
import {prisma} from '../utils/prisma/index.js';
import bcrypt from 'bcrypt';
import jwt from 'jsonwebtoken';
import authMiddleware from '../middlewares/auth.middleware.js';

bcrypt는 비밀번호 암호화하기 위해 설치한 패키지 (yarn add bcrypt)
authMiddleware은 토큰 관련 인증들을 정리한 js 파일
index.js는 prisma client를 이요하여 데이터베이스에 접근할 때 sql을 출력하는 것
jsonwebtoken은 jwt를 자바스크립트 언어로 구현하는 패키지

✏️ 회원가입

    const { email,password, name, age, gender, profileImage} = req.body;

/*기존에 존재하는 email인지 확인*/
    const isExistUser = await prisma.users.findFirst({
        where: {email}
    })

    if(isExistUser){
        return res.status(409).json({message:'이미 존재하는 이메일입니다.'});
    }

/*bcrypt의 hash함수를 통해 무엇을, 몇번 반복할 것인지 정하기*/
    const hashedPassword = await bcrypt.hash(password, 10);
    const user = await prisma.users.create({
        data: {
            email,
            password: hashedPassword
        }
    });

/*prisma를 이용하여 data 생성하기*/
    const userInfo = await prisma.userInfos.create({
        data: {
            userId: user.userId,
            name,
            age,
            gender,
            profileImage
        }
    })

• 기존에 있는 이메일인지 확인
• bcrypt(bycrypt가 아니다 오타 주의!)의 hash를 통해 비밀번호 암호화 (피드백받았던 부분을 이렇게 알게 되어서 흥미로웠다.)
• create로 userInfo의 data 작성하기

---

✏️ 로그인하기

    const {email, password} = req.body;

/*users table에서 email 불러와서 존재하는 email인지 확인, 확인 후 비밀번호가 일치하는지 확인*/
    const user = await prisma.users.findFirst({where:{email}});

    if(!user){
        return res.status(401).json({message:'존재하지 않는 이메일입니다.'});
    }

    if(!(await bcrypt.compare(password, user.password))){
        return res.status(401).json({message:'비밀번호가 일치하지 않습니다.'});
    }

/*데이터를 jwt로 변환*/
    const token = jwt.sign(
        {userId: user.userId},
        'custom-secret-key'
    );

/*개발자도구나 insomnia 쿠키에서 확인할 수 있다.*/
    res.cookie('authorization',`Bearer ${token}`);

사진은 jwt로 변환된 정보 (일부러 잘랐다). JWT.io에서 변환하면 정보가 반환된다.

---

✏️ 유저 정보 조회

router.get('/users', authMiddleware, async(req,res,next)=>{
    const {userId} =req.user;

    const user = await prisma.users.findFirst({
        where : {userId:+userId},
        select:{
            userId: true,
            email: true,
            createdAt: true,
            updatedAt: true,
            userInfos: {
                select:{
                    name: true,
                    age:true,
                    gender:true,
                    profileImage:true
                }
            }
        }
    });

    return res.status(200).json({data: user});
})

get으로 user의 id, email, 생성 날짜, 수정 날짜, userInfo 중 이름, 나이, 성별, 프로필 사진 주소를 불러온다.

---

인증 미들웨어

export default async function(req,res,next){
    try{
    const {authorization} = req.cookies;
    // user의 쿠키가 존재하는지 확인
    if(!authorization) throw new Error('요청한 사용자의 토큰이 존재하지 않습니다.');

    //authorization "Bearer dfsasdf(아무말)"
    const [tokenType, token]=authorization.split(' ');
    if(tokenType !=='Bearer') throw new Error('토큰 타입이 Bearer 형식이 아닙니다.');

/*verify()는 첫 번째 인자로는 토큰 문자열을 받고, 두 번째 인자로는 sign() 함수와 동일하게 키를 받음.*/
    const decodedToken = jwt.verify(token, 'custom-secret-key');
    /*token에서 id 가져오기*/
    const userId = decodedToken.userId;
    
    /*가져온 id로 user 찾기, user이 없으면 존재하지 않는다는 메세지 반환*/
    const user = await prisma.users.findFirst({
        where: {userId:+userId}
    });
    if(!user) throw new Error('토큰 사용자가 존재하지 않습니다.');

    req.user = user;

    next();
}catch(error){
    if(error.name==='TokenExpiredError'){
        return res.status(401).json({message:'토큰이 만료되었습니다.'});
    }
    if(error.name === 'JsonWebTokenError'){
        return res.status(401).json({message: '토큰이 조작되었습니다.'});
    }
    return res.status(400).json({message: error.message});
}
}

jwt.verify() 정보 출처:
https://www.daleseo.com/js-jwt/