Express-static

1369 ワード

Expressによる静的ファイルの管理


Expressに内蔵express.staticは、ピクチャ、CSS、JavaScriptファイルなどの静的ファイルを容易に管理することができる.
1.静的リソースファイルが存在するディレクトリをパラメータとして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

2.すべてのファイルのパスは、保存ディレクトリに対するものであるため、静的ファイルを保存するディレクトリ名はURLに表示されない.静的リソースが複数のディレクトリの下に保存されている場合は、expressを複数回呼び出すことができます.staticミドルウェア:
app.use(express.static('public'));
app.use(express.static('files'));
//         ,express.static

//                    

3.expressをすべて通過したい場合.staticがアクセスするファイルは、以下に示すように、「仮想(virtual)」ディレクトリ(ディレクトリが存在しない)の下に保存されます.静的リソースディレクトリにマウントパスを指定することで実現できます.
app.use('/static', express.static('public'));

これで、publicディレクトリの下のファイルに「/static」接頭辞付きのアドレスでアクセスできます.
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