Expressjs-static-files

提供:Dev Guides
移動先:案内検索

ExpressJS-静的ファイルの提供

静的ファイルは、クライアントがサーバーからそのままダウンロードするファイルです。 新しいディレクトリ public を作成します。 Expressでは、デフォルトで静的ファイルを提供できません。 次の組み込みミドルウェアを使用して有効にする必要があります。

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

注意-Expressは静的ディレクトリに関連するファイルを検索するため、静的ディレクトリの名前はURLの一部ではありません。

ルートルートがパブリックディレクトリに設定されているため、ロードするすべての静的ファイルはパブリックとしてルートと見なされることに注意してください。 これが正常に機能していることをテストするには、新しい public ディレクトリに画像ファイルを追加し、その名前を「 testimage.jpg 」に変更します。 ビューで、新しいビューを作成し、このファイルを次のように含めます-

html
   head
   body
      h3 Testing static file serving:
      img(src = "/testimage.jpg", alt = "Testing Image

あなたは次の出力を取得する必要があります-

静的ファイルの例

複数の静的ディレクトリ

また、次のプログラムを使用して複数の静的アセットのディレクトリを設定することができます-

var express = require('express');
var app = express();

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

app.listen(3000);

仮想パスプレフィックス

静的ファイルを提供するためのパスプレフィックスも指定できます。 たとえば、 '/static' のようなパスプレフィックスを指定する場合は、 index.js ファイルに次のコードを含める必要があります-

var express = require('express');
var app = express();

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

app.listen(3000);

これで、たとえば、パブリックディレクトリにあるmain.jsというスクリプトファイルを含める必要がある場合は、次のスクリプトタグを使用します-

<script src = "/static/main.js"/>

この手法は、複数のディレクトリを静的ファイルとして提供する場合に役立ちます。 これらのプレフィックスは、複数のディレクトリを区別するのに役立ちます。