n_hachiのメモ

メモです。

express使用時のapp.use(express.static(__dirname + '/public'))の意味

背景

他者がつくったアプリを拝見していたときに app.use(express.static(__dirname + '/public')) と書かれた箇所があり、この文の意味が分からなかったので調べた。

説明

Express での静的ファイルの提供に説明があった。

イメージ、CSS ファイル、JavaScript ファイルなどの静的ファイルを提供するには、Express に標準実装されている express.static ミドルウェア関数を使用します。
静的アセットファイルを格納しているディレクトリーの名前を express.static ミドルウェア関数に渡して、ファイルの直接提供を開始します。例えば、public というディレクトリー内のイメージ、CSS ファイル、JavaScript ファイルを提供するには、次のコードを使用します。
(中略)
ただし、express.static 関数に指定するパスは、node プロセスを起動するディレクトリーに対して相対的です。別のディレクトリーから Express アプリケーションを実行する場合は、提供するディレクトリーの絶対パスを使用する方が安全です。

試してみる

app.use(express.static('public'))app.se(express.static(__dirname+'/public'))の違いを確認するリポジトリを作成した。
n-hachi/prac_express_app_use

以下に確認方法を記す

前準備

アプリのインストールおよび起動準備

git clone https://github.com/n-hachi/prac_express_app_use
cd prac_express_app_use
npm install

case1:リポジトリのトップディレクトリでnodeを実行する

# case1
node index.js

この状態なら http://localhost:8000/path1http://localhost:8000/path2 ともにアクセスできる。

case2:リポジトリのトップ以外のディレクトリでnodeを実行する

まずcase1で走らせたnodeプロセスを終了する

mkdir tmp
cd tmp
node ../index.js

case1とは異なり http://localhost:8000/path1 はアクセスできるが http://localhost:8000/path2Cannot GET /path2/と表示される。
これはファイルtmp/path2/index.htmlが存在しないために発生する。

まとめ

app.use(express.static(__dirname + '/public'))の意味を勉強した。
あと__dirnameをつけないときはapp.use(express.static('public'))のようにpublicの前にスラッシュが不要なのだが、__dirnameを付加するときはpublicの前にスラッシュが必要なことに気づかず、数分なやんでしまった。
もし同じような動きになったときはスラッシュの有無を確認してほしい。