Express基础(中)

简介: Express基础(中)

托管静态资源


express.static()

express 提供了一个非常好用的函数,叫做 express.static(),通过它,我们可以非常方便地创建一个静态资源服务器。

例如,通过如下代码就可以将 public 目录下的图片、CSS 文件、JavaScript 文件对外开放访问了:

app.use(express.static('clock'))

现在,你就可以访问 public 目录中的所有文件了:

http://localhost:8080/index.csss

http://localhost:8080/index.html

http://localhost:8080/index.js

示例代码:

const express = require('express')
const app = express()
app.use(express.static('clock'))
app.listen(8080, () => {
    console.log('server is running');
})

注意:Express 在指定的静态目录中查找文件,并对外提供资源的访问路径。 因此,存放静态文件的目录名不会出现在 URL 中。

托管多个静态资源目录

如果要托管多个静态资源目录,请多次调用 express.static() 函数:

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

访问静态资源文件时,express.static() 函数会根据目录的添加顺序查找所需的文件。

挂载路径前缀

如果希望在托管的静态资源访问路径之前,挂载路径前缀,则可以使用如下的方式:

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

现在,你就可以通过带有 /public 前缀地址来访问 public 目录中的文件了: http://localhost:8080/public/images/kitten.jpg

http://localhost:8080/public/css/style.css

http://localhost:8080/public/js/app.js


nodemon


为什么要使用 nodemon

在编写调试 Node.js 项目的时候,如果修改了项目的代码,则需要频繁的手动 close 掉,然后再重新启动,非常繁琐。

现在,我们可以使用 nodemon(www.npmjs.com/package/nod…) 这个工具,它能够监听项目文件 的变动,当代码被修改后,nodemon 会自动帮我们重启项目,极大方便了开发和调试

安装 nodemon

在终端中,运行如下命令,即可将 nodemon 安装为全局可用的工具:

npm install -g nodemon  

使用 nodemon

当基于 Node.js 编写了一个网站应用的时候,传统的方式,是运行 node app.js 命令,来启动项目。这样做的坏处是: 代码被修改之后,需要手动重启项目。

现在,我们可以将 node 命令替换为 nodemon 命令,使用 nodemon app.js 来启动项目。

这样做的好处是:代码 被修改之后,会被 nodemon 监听到,从而实现自动重启项目的效果。

node app.js
nodemon app.js


Express 路由


路由的概念


在 Express 中,路由指的是客户端的请求与服务器处理函数之间的映射关系。

Express 中的路由分 3 部分组成,分别是请求的类型、请求的 URL 地址、处理函数,格式如下:

app.METHOD(PATH, HANDLER)

Express 中的路由的例子

// 匹配 GET 请求,且请求 URL 为 /
app.get('/', function (req, res) {
    res.send('hello world!')
})
// 匹配 POST 请求,且请求 URL 为 /
app.post('/', function (req, res) {
    res.send('got a post request')
})

路由的匹配过程

每当一个请求到达服务器之后,需要先经过路由的匹配,只有匹配成功之后,才会调用对应的处理函数。

在匹配时,会按照路由的顺序进行匹配,如果请求类型和请求的 URL 同时匹配成功,则 Express 会将这次请求,转 交给对应的 function 函数进行处理。

1670071302037.jpg

路由匹配的注意点:

① 按照定义的先后顺序进行匹配

② 请求类型和请求的URL同时匹配成功, 才会调用对应的处理函数

相关文章
|
6月前
|
JavaScript 前端开发 中间件
玩转Express(三)实现你的Express
玩转Express(三)实现你的Express
|
6月前
初识express框架
初识express框架
|
6月前
|
Web App开发 JSON 中间件
express学习 - (3)express 路由
express学习 - (3)express 路由
142 1
|
6月前
|
JavaScript 前端开发 中间件
Express 框架介绍
Express 框架介绍
91 # 实现 express 的优化处理
91 # 实现 express 的优化处理
52 0
|
前端开发 中间件
86 # express 基本实现
86 # express 基本实现
76 0
|
开发框架 JavaScript 前端开发
Express
Express 是一个基于 Node.js 的快速、简洁、灵活的 Web 应用开发框架。它提供了一系列强大的功能,帮助开发者快速构建各种 Web 应用。Express 的原理是利用 Node.js 内置的 http 模块,通过中间件和路由等功能,实现Web应用的开发。
201 1
|
JavaScript 前端开发 中间件
Express基础使用和基础配置
Express 简介 Express 是一个简洁而灵活的 node.js Web应用框架, 提供一系列强大特性帮助你创建各种Web应用。
116 0
Express基础使用和基础配置
|
JSON JavaScript 前端开发
|
开发框架 JavaScript 前端开发