Express를 통한 정적 파일 호스팅


Express를 통한 정적 파일 호스팅
Express 내장형express.static을 사용하면 이미지, CSS, JavaScript 파일 등 정적 파일을 손쉽게 관리할 수 있습니다.
정적 자원 파일이 있는 디렉터리를 매개 변수로 express.static 중간부품에 전달하면 정적 자원 파일에 접근할 수 있습니다.예를 들어, public 디렉토리에 그림, CSS, JavaScript 파일이 배치되어 있다고 가정하면 다음을 수행할 수 있습니다.

app.use(express.static('public'));

이제 public 디렉터리 아래의 파일에 접근할 수 있습니다.

http://localhost:3000/images/kitten.jpg
http://localhost:3000/css/style.css
http://localhost:3000/js/app.js
http://localhost:3000/images/bg.png
http://localhost:3000/hello.html

모든 파일의 경로는 저장 디렉터리에 상대적이기 때문에 정적 파일을 저장하는 디렉터리 이름은 URL에 나타나지 않습니다.
정적 자원을 여러 디렉터리 아래에 저장하면 express.static 중간부품을 여러 번 호출할 수 있습니다.

app.use(express.static('public'));
app.use(express.static('files'));

정적 자원 파일에 접근할 때 express.static 중간부품은 디렉터리에 추가된 순서에 따라 필요한 파일을 찾습니다.express.static로 접근한 모든 파일을'가상(virtual)'디렉터리(즉 디렉터리가 존재하지 않음) 아래에 저장하고 싶다면 정적 자원 디렉터리에 마운트 경로를 지정하는 방식으로 다음과 같이 할 수 있다.

app.use('/static', express.static('public'));

이제 '/static' 접두사가 있는 주소를 통해 public 디렉터리 아래의 파일에 접근할 수 있습니다.

http://localhost:3000/static/images/kitten.jpg
http://localhost:3000/static/css/style.css
http://localhost:3000/static/js/app.js
http://localhost:3000/static/images/bg.png
http://localhost:3000/static/hello.html