회원가입 구현해보자..

01. 일단은 분기 부터.. 

 

분기 부터 하는게 코드도 깔끔 내가 보는거도 깔끔하기 때문에 user에 관한거는 user라우터에 분기를 때린다.

app.js

// 라우터 분기 
app.use("/user", userRouter)

 

 

그리고 이 분기를 하는곳에다가 코드를 짤껀데 

routes/user.js

// 회원가입
router.post("/signup", async(req, res) => {
    await User.create({
        email:req.body.email,
        name: req.body.name,
        nickName: req.body.nickName,
        password: req.body.password,
    })
    res.send("ok")
})

 

이런 식이다 여기에서의 예시로 api주소를 보자면 post("/user/signup") 이렇게 되는거고 
여기서 User.create안의 것은 프론트에서 백에다가 넘겨주는 데이터 라고 생각하면 된다.
또 중요한점 비동기 라서 그냥 쓰면 안되고 async/await를 써줘야한다.

왜냐면 데이터를 정상적으로 날리고 밑에 보면 

 res.send("ok")  라는 응답하는 데이터가 보일텐데 이거도 비동기라서 어느게 먼저 처리가 될지 모르기 때문이다.

 

또 중요한점 req.body라는것을 그냥 쓰는게 아니라 분기한거 보다 위에다가

app.js

// 프론트에서 json으로 보냇을때
app.use(express.json())
// 프론트에서 form으로 보냇을때
app.use(express.urlencoded({extended:true}))

 

이거 두개를 적어주는데 왜 적어주냐 프론트에서 보내온 데이터를 해석해준다.

가장중요한가는 진짜 분기한거보다 위에다가 안적으면 문제가 생긴다.

 

02. 비밀번호는 관리자도 모르게... 

 

말그대로다 위같이 비밀번호를 db에다가 저장하면 문제가 생기기 때문에 절대 저렇게 생으로 저장하면 안된다.

그레서 사용해야할것은 이건데 이거는 비밀번호를 알아보기 힘들게 만들어 주는라이브러리다. 암호화 한다고 생각하면 되는데 작정하고 뚫으면 뚫긴 하겟지... 

npm i bcrypt

// 회원가입
router.post("/signup", async(req, res) => {
    const bcryptPassword = await bcrypt.hash(req.body.password,10)
    await User.create({
        email:req.body.email,
        name: req.body.name,
        nickName: req.body.nickName,
        password: bcryptPassword,
    })
    res.send("ok")
})

 

여기서 숫자를 높게 할수록 보안이 강화가 된다.

 

또 중요한거 여기서 기존에 회원가입이 되있는지 부터 확인을 해야되서 

// 회원가입
router.post("/signup", async(req, res,next) => {
    try {
        // db에 중복되는게 잇는지 없는지 확인부터 
        const exUser = await User.findOne({
            where:{
                email:req.body.email,
                nickName: req.body.nickName,
            }
        })
        // 중복이 되는게 있다고 하면 에러메시지 보낸다.
        if (exUser){
           return res.status(403).send("이미 사용중인 아이디입니다.")
        }
        const bcryptPassword = await bcrypt.hash(req.body.password, 12)
        await User.create({
            email: req.body.email,
            name: req.body.name,
            nickName: req.body.nickName,
            password: bcryptPassword,
        })
        res.send("ok")
    } catch (error) {
        next(error)
    }
})

 

User 테이블에 findOne으로 찾아 보는데 프론트에서 보낸 이메일과 닉네임이 있으면 프론트로 에러메시지를 보내는거고 

밑에 보면 next라는게 생겻는데 이거는 에러낫다 (500) 확인해봐~ 이런뜻임.