Enjoy Programming

Express- Protectiong Videos Routes && profile page view video list 본문

JavaScript/Node.JS

Express- Protectiong Videos Routes && profile page view video list

LEETAEEON 2021. 5. 17. 09:57

앞서 만든 video edit은 로그인한 유저와 비디오 작성자 정보가 다르면 수정이 안되는 거였지만

문제는 routes활용해 url 마지막에 /edit을 써주면 수정페이지로 이동하게 된다.

 

이를 수정해보자~

get edit컨트롤러에서  video 객체를 받아와 조건문을 달아주자

video를 작성한 사람이 현재 로그인한 유저가 아니면 에럴를 발생시키고 아니면 수정페이지를 띄우게 한다.

한가지 주의 할 점은 video.creator는 타입이 object타입이고 req.user.id는 string 타입이다.

둘의 타입을 같게 해줘야 조건문이 성립하기에

video.creator를 toString()을 이용해 변환해주자.

그럼 성공적이다~!~!

이와 같이 delete 컨트롤러도 수정해주자

몇가지 수정을 더 해야하지만 일단 여기까지 하고 비디오 상세 페이지에서

작성자를 눌러 들어가면 작성자가 올린 비디오가 뜨도록 수정해주자

-----------******* 추가사항 ******** --------------

프로필 페이지 비디오 list 작업을 하기 앞서.. 한가지 문제가 생겼다.

delete컨트롤러를 실행하면 .. videos 컬렉션에서는 해당 비디오가 삭제가 된다..

하지만 user의 videos 필드에는 그대로 남아있는 것이다... 하.. 일단 user모델을 video controller에 import 해주고

findOneAndUpdate를 통해 업데이트를 하는데 옵션에 $unset을 줘서 해결 하려고 했으나

$unset 사용시 .. 필드 자체가 다삭제되어 db상에 정보가 뜨지 않는 것이다..ㅡㅡ;;

홈페이지 상에는 남아있고 딜릿도 되는데 문제는 저게 한번에 다 삭제가 되었다..

검색 검색을 하던중 $pull을 이용하라고 한다. $pull 이용하니 성공!!~!

.. 이대로 잘 가주길.. 또 다른 문제점이 생길 수 있다.. ㅜㅜ

 

---------------------------------------------------------------------------------------------------------------------

 

이제 프로필 페이지 이동시 작성자가 업로드한 비디오를 보여주도록 한다.

프로필 페이지 컨트롤러를 수정해준다.

req.user의 id를 이용해 사용자를 찾고 .poluate를 이용해 vdieos 객체를 불러와준다

https://mongoosejs.com/docs/populate.html

 

Mongoose v5.12.9: Query Population

Populate MongoDB has the join-like $lookup aggregation operator in versions >= 3.2. Mongoose has a more powerful alternative called populate(), which lets you reference documents in other collections. Population is the process of automatically replacing th

mongoosejs.com

일반 userDetail과 로그인된 유저의 getMe 컨트롤러 모두 수정해준다.

 

그리고 userDetail 템플릿으로 이동해 mixin 템플릿인 videoBlock을 import 해주고

업로드 비디오 블럭을 하나 만들어서 vidoeBlock을 추가해줬다.

 

 

여기까지 하고 두가지를 수정하는데 프로필 사진이 안뜨는 현상이 생기는데

아마 getMe컨트롤러는 globalRouter에서 userDetail컨트롤러는 userRouter에서 사용하고 있다보니

절대 경로가 다르다. 그로인해 어느쪽에서 접속하느냐에 따라 페이지의 사진이 안보이는 현상이 생긴다.

아에 경로를  es6 literal을 사용해서 `/${user.avatarUrl}`로 변경해주니 정상 작동한다.

그리고 이와 같은현상으로 video상세페이지 및 일반 프로필 페이지에서 비디오 블록이 비디오를 제대로 불러오지 못해서

비디오재생이 안된다. 이 또한 경로 설정을 변경해주는데

이렇게 변경해주면 제대로 작동한다.~!~! 끝~ 이제 백엔드는 거의 끝나간다.

 

이제 다시 스타일링을 좀 해주고 추가를 해주자.