React_구독기능(2)

0. onClick func

구독 button을 클릭하면 onSubscirbe func 실행

 

1. 구독 or not  func

: props 생성(userTo, userFrom) / 성공하면 useState 변형하기

**VideoDetail Page에 props 추가 = userFrom={localStage.getItem('userId') 속성 추가

 

const onSubscribe=()=>{

        let subscribeVariable={userTo:props.userTo, userFrom:props.userFrom}

        

        // 이미 구독 중이라면

        if(Subscribed){

            Axios.post('/api/subscribe/unsubscribe', subscribeVariable)

                .then(response=>{

                    if(response.data.success){

                        setSubscribeNumber( SubscribeNumber - 1 )

                        setSubscribed( !Subscribed )

                    }else{

                        alert('구독을 취소하는 데 실패했습니다.')

                    }

                })

        // 구독 중이지 않다면

        }else{

            Axios.post('/api/subscribe/subscribe', subscribeVariable)

                .then(response=>{

                    if(response.data.success){

                        setSubscribeNumber( SubscribeNumber + 1 )

                        setSubscribed( !Subscribed )

                    }else{

                        alert('구독하는 데 실패했습니다.')

                    }

                })

        }

    }

 

 

2. 구독 or not MongoDB save&delete

: findOneAndDelete, save, new 객체

router.post('/unsubscribe', (req, res)=>{

    Subscriber.findOneAndDelete({'userTo':req.body.userTo, 'userFrom':req.body.userFrom})

        .exec( (err,doc)=>{

        if(err) return res.status(400).send(err);

        return res.status(200).json({success:true, doc})

    })

}) 

router.post('/subscribe', (req, res)=>{

    const subscribe = new Subscriber(req.body)    : instance 생성 (기타 - Java instance 참고)

    subscribe.save((err,doc)=>{

        if(err) return res.status(400).send(err);

        return res.status(200).json({success:true})

    })

})