5. 물품 상세 // 물품 (유저별로 다르게) 장바구니에 담기 // (유저별로 다르게) 장바구니 구현하기! With Ajax

개요(동작원리)

로그인  ==>>

세션에는 로그인한 req.session.authUserId 가 저장됌  ==>>

물품 상세정보창에서 카트에 담기, 카트에 담을때는, userid와 productid를 비롯한 값을 AJAX로 보냄  ==>>

카트에 진입하는 순간 cart/authUserId 로 동적인 URL 생성 ==>>

DB에서는 authUserId 받아서,  UserId와 맞는 정보만 DB에서 빼와 render

 

물품상세

    크게 별거 없는 상세페이지

     * AJAX를 위해, 버튼에 csrf data, userid data, productid data를 넣어두었다.

 

카트에 담기 WITH AJAX

ajax로 post 요청을 보낸후, 답을 받아온다.

답이 오지 않을 경우는, 미리 다 쳐내고 auth session을 받지 않는 경우 뿐이므로, alert에 경고를 표시해주었다.

* 키포인트는 csrf 토큰을 쿼리매서드로, 서버에 보낸것과

  Ajax의 post 요청방법이다.

 

카트

아직 덜만든 카트...

카트에 접근하는 태그는 로그인 했을때, 와 로그인 하지 않았을때로 구분하여, 헤더에 넣어주었다.

로그인을 했다면, 그 아이디로, 세션을 받아 [개인별로 다른 카트를 생성해낼것이다]

 

Ajax 요청은 라우터를 넘어

컨트롤러에 당도하게되며

컨트롤러에서는 모델에서  떼온 코드로 DB와 상호작용 할것이다.

 

 

로그인을 안한다면

경고문구와 함께 login 하라는 버튼이... CSS는 나중에!

 

역시나 경고문구와 함께 카트에 담을 수 없게 된다.

 

좋았던점

Ajax post를 연습해서 좋았다.

그랬다.

손이 좀 빨라졌나?

생각하는 것이 조금 더 부드러워졌다.