ExpressJS - 服務靜態檔案

靜態檔案是客戶端從伺服器上下載的檔案。建立新目錄，即public。預設情況下，Express 不允許您下載靜態檔案。您需要使用以下內建中介軟體來啟用它。

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

注意 − Express 相對靜態目錄查詢檔案，所以靜態目錄的名稱並不是 URL 的一部分。

請注意，根路由現在設定在 public 目錄，所以您載入的所有靜態檔案都將把 public 視為根目錄。為了測試是否正常，請在新的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);

現在，每當您需要包含一個檔案時，比如位於 public 目錄中的名為 main.js 的指令碼檔案，請使用以下指令碼標籤 −

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

當提供多個目錄作為靜態檔案時，此技巧可能派上用場。這些字首有助於區分不同的目錄。