Enjoy Programming

Express - Uploading and Creating a Video 2 본문

JavaScript/Node.JS

Express - Uploading and Creating a Video 2

LEETAEEON 2021. 5. 5. 10:21

비디오 업로드는 되지만 비디오가 재생이 되지는 않는다 현재 링크가 제대로 이루어지지 않았기 때문이다.

일단 생성된 videos폴더를 지우고 다시 upload/videos로 변경해주자

주의할 점은 /upload/vidoes로 하면 컴퓨터상의 root로 설정이 되기때문에 프로젝트상의 폴더로 꼭 지장해주자.

그리고 몽고db에서 업로드한 파일을 지워주는데

터미널에서 mongo를치고 mongodb에 접속 후 use를 이용해 생성한 we-tube db에 접속하자

use we-tube>> mongodb 명령어는 mongo로 접속후 help를 치면 자세히 나온다

접속했으면 데이터들을 삭제 ( db.videos.remove({}) ) 그리고 exit

 

그리고 업로드를하면 .. 역시 파일이 재생되지 않는다.

아직 한가지 빼먹은게 있는데 express는 기본적으로 모든 것에데해나 route가 있다. upload역시 route 설정을 해줘야 한다.

app.js로 가자

 app.use("/uploads", express.static("uploads/"));를 작성해주자

/uploads에 접근하기 위해 express.static함수를 사용해서 접근했다. expressjs.com을 확인해보면

이미지, css파일 및 javascript파일과 같은 정적 파일을 제공하려면 express의 기본제공 미들웨어 함수인 express.static을 사용하라고 한다.

또한 이를 사용하면 정적 자산이 포함된 디렉토리의 이름을 express.static 미들웨어 함수에 전달하면 파일의 직접적인 제공을 시작할 수 있다.

익스프레스는 express.static 미들웨어 함수를 이용해 정적 디렉토리를 설정한 순서대로 파일을 검색한다.

exrpess.static함수를 통해 제공되는 파일에 대한 가상 경로 접두부(파일 시스템 내에 해당 경로가 실제로 존재하지 않는 경우)를 작성하려면 정적 디렉토리에 대한 마운트 경로를 지정해야 한다.

이런식으로~ 

참고로 express.static함수에 제공되는 경로는 node 프로세스가 실행되는 디렉토리에 데해 상대적이다. express앱을 다른 디렉토리에서 실행하는 경우에는 다음과같이 제공하길 원하는 디렉토리의 절대 경로를 사용하는 것이 더 안전하다,

 

자 이제 재생이.. 안된다.. 빼먹었다 home템플릿에 videoBlock을 추가해줄때 객체의 값을 item.videoFile로 했었다.

바꿔주자 정의된 스키마에 fileUrl이니 item.fileUrl로 ~

이제 재생이된다.

 

---* static file은 주로 javascript나 css 로고 파일이다. 현재는 static을 적용하긴 했지만 이것은 좋은 방법이 아니라고 한다. *---

user같은 생성된 content는 server와 분리해줘야 한다. 지금은 나만 업로드하는 서버이지만

여러명이 수많은 데이터를 업로드한다고 할때 그리고 여러 서버가 필요하다고 할때

그럼 기존에 있던 서버의 데이터를 새로운 서버에 복사해서 넘겨야하는가 ... 잘못된것이다. 일단은

기초를 배우기에 이런방식으로 하는것이고 마무리 단계에서 다루는방법을 다시 하기로 한다.

 

그리고 한가지 빼먹었는데 .gitignore에 uploads폴더는 ignore해주자 내가 올린거 전세계로 배포될 수도...ㅎㅎ