ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • edit-video
    Project using node.js/Cloning Youtube 2020. 8. 31. 08:03

    routes.js

      videoDetila, editVideo, deleteVideo와 userDetail은 다른 routes와는 다르다. 이들은 고유 id 값에 따라 보여줘야 하는 페이지가 다르기 때문이다. 다른 routes은 key-string이지만 이들은 key(함수명) - value(함수)으로 이루어져 있다. 인자로는 id 값을 받는다.

    routes.js - EDIT_VIDEO

     

    routes.js - editVideo

    videoRouter.js

      videoRouter.js를 보면은 첫번째 인자인 router를 주는 값도 다르다. 다른 router는 string을 주지만 videoDetail은 routes.editVideo()로 함수를 준다. 또한 route를 함수로 주는 router들은 다른 router들보다 항상 맨 밑에 있어야 한다. 그렇지 않으면 다른 router들은 작동하지 않는다.

      예를 들어, editVideo()가 upload보다 위에 있을 경우, user가 localhost/videos/upload에 접속하게 되면 저 경로 접속하는 것이 아니라 editVideo로 접속하게 된다. 왜냐하면 JS는 코드를 위에서부터 아래로 읽기 때문에 upload가 :id 값으로 인식한다. routes.js에서 정의한 :id는 변수를 뜻한다.

    videoRouter.js

    videoController.js

       req.params.id는 url 경로에서 :id 값을 가져온다. 해당 id 값은 videoId 값이다. 이 값으로 DB에서 video를 찾는다. populate로 가져오지 않은 video.creator는 객체이기 때문에 String으로 형변환을 해줘야 한다. 그 후 현재 user의 id 값과 비교해서 video를 편집하려는 사용자가 video의 작성자가 맞는지를 확인한다. 그렇지 않다면 editVideo 페이지를 보여주지 않는다.

    getEditVideo

      사용자로부터 수정할 title과 description을 받는다. Video.findByIdAndUpadate를 통해서 id 값에 해당하는 video의 title과 description을 수정하고 수정된 videoDetail을 보여준다.

    postEditVideo

     

    View

    editVideo.pug

     

    videoDetail - view
    getEditVideo - view (수정 전)
    getEditVideo - view (수정)
    getEditVideo - view (수정 후)

    참고 자료

    소스 코드

    https://github.com/zpskek/wetube-v3/commit/ef4e8795114f9ac5255a277b6e9d9d5450a736d6

     

    'Project using node.js > Cloning Youtube' 카테고리의 다른 글

    Webpack  (0) 2020.09.01
    delete-video  (0) 2020.08.31
    search  (0) 2020.08.30
    Route protection  (0) 2020.08.29
    home  (0) 2020.08.29

    댓글

Designed by Tistory.