Express之托管静态文件的方法

下面我将为您详细讲解关于 Express 中托管静态文件的方法。

Express 托管静态文件的方法

在 Express 中，我们可以使用 express.static 中间件来托管静态文件。express.static 模块的作用是将一个或多个目录指派为包含静态资产的目录，这些资产将直接送至客户端。

使用方式

我们可以通过如下方式使用 express.static 中间件来托管静态文件：

const express = require('express')
const app = express()

// 将 public 文件夹指定为静态资源目录
app.use(express.static('public'))

上述代码中，将 public 目录作为静态文件目录，当客户端使用相对于 / 的 URL 路径对这个目录发起请求时，Express 将自动搜索相应文件并将其发送给客户端。

有时候，我们还可以将多个目录进行静态资源托管。下面是一个示例：

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

在这里，public 和 files 都被指定为静态文件目录，当我们以相对于 / 的路径访问这些目录时，Express 将在两个目录下查找相应文件并发送给客户端。

示例说明

下面提供两个关于静态文件托管的示例：

我们可以在项目根目录下创建一个名为 public 的文件夹，并在其中添加一个名为 index.html 的文件。

<!-- public/index.html -->
<!DOCTYPE html>
<html>
  <head>
    <title>静态文件托管示例</title>
  </head>
  <body>
    <h1>Hello, Express!</h1>
    <img src="/img/express-logo.png" alt="Express" />
  </body>
</html>

在 public/index.html 文件中，我们添加了一张 Express 的 logo，并通过 <img> 元素引用了这个图片。

我们还可以在 public 文件夹下，创建一个名为 img 的文件夹，并在其中添加一个名为 express-logo.png 的文件。

const express = require('express')
const app = express()

// 托管 public 文件夹下的静态文件
app.use(express.static('public'))

// 监听 3000 端口号
app.listen(3000, () => {
  console.log('server started at port: 3000')
})

在上述代码中，我们将 public 文件夹指定为静态文件目录，并通过 app.listen 方法监听 3000 端口号。在浏览器中访问 http://localhost:3000/，将会看到一个引用了 public/img/express-logo.png 资源的网页。

这就是我们使用 express.static 中间件托管静态文件的完整攻略，希望对您有帮助！

本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：Express之托管静态文件的方法 - Python技术站