내배캠 41일차 til 간단한 로그인 기능

개요

 

정예반 하면서 만든 로그인 기능

 

물론 만들던 시절엔 간단하지 않았다

패키지로 cookie-parser, jsonwebtoken, express 를 사용함

 

db없이 로컬에 배열만 만들어서 사용

 

---

어떻게 쓰나

 

const express = require('express')
const cookieParser = require('cookie-parser')
const jwt = require('jsonwebtoken')
//사용하는 npm i


const app = express()
app.use(express.json())
app.use(cookieParser())
//사용하는 앱

const port = 안알려줌
const users = require('./db/users')
//포트 설정,외부 db(로컬내 json으로 구현)



const jwtConfig = {
    secretKey: "안알려줌",//시크릿키
    options: {
        algorithm: "HS256",//상황보고 주석화
        expiresIn: "15m",//1분짧더라
        issuer: "안알려줌"//발행자
    }

}
//jwt 쓰기, 밖으로 뺄까?

app.get('/', (req, res) => {
    const tenArticles = [...articles]
    res.send(tenArticles.splice(0, 10))
})
//게시글 상위 10개 가져오는 API,

// 로그인 API
app.post('/login', (req, res) => {
    //     - email, password 받아서 해당하는 유저가 존재하는지 확인
    const { email, password } = req.body
    // const user = users.find(user => user.email === email && user.password === password)
    const user = users.find(user => user.email === email)
    if (!user) {
        res.status(404).json({
            errorMessage: '해당 아이디가 없습니다.'
        })
    }
    // const userPass = users.find(user => user.password === password)
    // if (!userPass) {
    //     res.status(404).json({
    //         errorMessage: '비밀번호가 틀립니다.'
    //     })
    // } //이건 유저 비밀번호가 아닌 그냥 모든 비번중에 찾는거라 틀립니다

    if (user.password !== password) {
        res.status(404).json({
            errorMessage: '비번이 틀렸습니다.'
        })
    }
// 고침


    const token = jwt.sign({ name: user.name, id: user.id }, jwtConfig.secretKey, jwtConfig.options)
    res.cookie('jwt', token)
    console.log(req.cookies)
    res.send({ result: true })
})


app.listen(port, () => {
    console.log(port, '포트로 서버가 열렸어요!');
});

 

 

정말 많은 일이 있었고 더럽게 힘들었다

완벽하진 않지만 대강 비슷한 결과를 냄

 

 

작동방식

 

 

노드로 js 실행

 

썬더 클라이언트,포스트맨 등 테스트 프로그램으로

post /login  body에 json형식 맞춘 데이터 입력, send

 

1차적으로 아이디 존재유무(오타감지) 검색 - 에러 시  404

2차적으로 비번 오타유무 - 에러시 404

 

둘다 맞으면 토큰 발행

 

지금보니 받지도 않은 유저 네임이랑 user.id를 토큰으로 보냈지만

사소한 찐빠는 작전입니다

---

만난 오류들

 

1. 

 

500 bad gateway

 

이건 다시 구현하는게 개같다

받은 피드백은 "오타와 변수설정 미숙"

 

 

2.

 

find 또 써서 틀림

 

 

app.post('/login', (req, res) => {
    //     - email, password 받아서 해당하는 유저가 존재하는지 확인
    const { email, password } = req.body
    // const user = users.find(user => user.email === email && user.password === password)
    const user = users.find(user => user.email === email)
    if (!user) {
        res.status(404).json({
            errorMessage: '해당 아이디가 없습니다.'
        })
    }
    // const userPass = users.find(user => user.password === password)
    // if (!userPass) {
    //     res.status(404).json({
    //         errorMessage: '비밀번호가 틀립니다.'
    //     })
    // } //이건 유저 비밀번호가 아닌 그냥 모든 비번중에 찾는거라 틀립니다

 

밑에 유저패스로 돌린 것

 

저게 맞는 줄 알았는데 나중에 보니 위의 find에서 찾은 유저와는 상관없이

전체 배열중에서 그런 암호가 있는지 찾고 있었다

 

고친 법

    if (user.password !== password) {
        res.status(404).json({
            errorMessage: '비번이 틀렸습니다.'
        })
    }
// 고침

find 안함

 

맨처음에 바디로 가저 온 값에 패스워드 있고,

입력한 아이디에 맞는 비번을 검색함

 

 

---

 

 

결론

 

정예반 듣길 잘 했다 아마