- ExpressJS 教程
- ExpressJS - 主页
- ExpressJS - 概述
- ExpressJS - 环境
- ExpressJS - 你好世界
- ExpressJS - 路由
- ExpressJS - HTTP 方法
- ExpressJS - URL 构建
- ExpressJS - 中间件
- ExpressJS - 模板
- ExpressJS - 静态文件
- ExpressJS - 表单数据
- ExpressJS - 数据库
- ExpressJS - Cookie
- ExpressJS - 会话
- ExpressJS - 身份验证
- ExpressJS - RESTful API
- ExpressJS - 脚手架
- ExpressJS - 错误处理
- ExpressJS - 调试
- ExpressJS - 最佳实践
- ExpressJS - 资源
- ExpressJS 有用资源
- ExpressJS - 快速指南
- ExpressJS - 有用的资源
- ExpressJS - 讨论
ExpressJS - 提供静态文件
静态文件是客户端从服务器下载的文件。创建一个新目录public。Express 默认情况下不允许您提供静态文件。您需要使用以下内置中间件来启用它。
app.use(express.static('public'));
注意- Express 查找相对于静态目录的文件,因此静态目录的名称不是 URL 的一部分。
请注意,根路由现在设置为您的公共目录,因此您加载的所有静态文件都将被视为公共根目录。要测试它是否正常工作,请在新的公共目录中添加任何图像文件并将其名称更改为“ 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" />
当提供多个目录作为静态文件时,此技术可以派上用场。这些前缀可以帮助区分多个目录。