在Express中提供靜態(tài)文件的實現(xiàn)方法
為了提供諸如圖像、CSS 文件和 JavaScript 文件之類的靜態(tài)文件,請使用 Express 中的 express.static 內(nèi)置中間件函數(shù)。
將包含靜態(tài)資源的目錄的名稱傳遞給 express.static 中間件函數(shù),以便開始直接提供這些文件。例如,使用以下代碼在名為 public 的目錄中提供圖像、CSS 文件和 JavaScript 文件:
app.use(express.static('public'));
現(xiàn)在,可以訪問位于 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
Express 相對于靜態(tài)目錄查找文件,因此靜態(tài)目錄的名稱不是此 URL 的一部分。
要使用多個靜態(tài)資源目錄,請多次調(diào)用 express.static 中間件函數(shù):
app.use(express.static('public'));
app.use(express.static('files'));
Express 以您使用 express.static 中間件函數(shù)設(shè)置靜態(tài)目錄的順序來查找文件。
要為 express.static 函數(shù)提供的文件創(chuàng)建虛擬路徑前綴(路徑并不實際存在于文件系統(tǒng)中),請為靜態(tài)目錄指定安裝路徑,如下所示:
app.use('/static', express.static('public'));
現(xiàn)在,可以訪問具有 /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
然而,向 express.static 函數(shù)提供的路徑相對于您在其中啟動 node 進(jìn)程的目錄。如果從另一個目錄運行 Express 應(yīng)用程序,那么對于提供資源的目錄使用絕對路徑會更安全:
app.use('/static', express.static(__dirname + '/public'));
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
在Node.js中使用Express實現(xiàn)視頻評論的列表展示和刪除功能
在現(xiàn)代Web應(yīng)用中,視頻內(nèi)容和互動功能(如評論)的結(jié)合極大地增加了用戶的參與度,本文將通過一個具體的例子,展示如何在Node.js環(huán)境中使用Express框架來實現(xiàn)視頻評論的列表展示和刪除功能,需要的朋友可以參考下2024-04-04
Node.js基礎(chǔ)入門之模塊與npm包管理器使用詳解
Node.js是一個基于Chrome?V8引擎的JavaScript運行時。類似于Java中的JRE,.Net中的CLR。本文將詳細(xì)為大家介紹Node.js中的模塊與npm包管理器的使用,需要的可以參考一下2022-03-03
使用Typescript和ES模塊發(fā)布Node模塊的方法
這篇文章主要介紹了使用Typescript和ES模塊發(fā)布Node模塊的方法,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-05-05

