Node.js Express 框架

在本教程中,我们还将介绍 express 框架。该框架的构建方式使其充当最小且灵活的 Node.js Web 应用程序框架,为构建单一和多页以及混合 Web 应用程序提供了一组强大的功能。

在本教程中,你将学习 -

  • 什么是 Express.js?
  • 安装和使用 Express
  • 什么是路由?
  • 使用 express.js 的示例 Web 服务器

什么是 Express.js?

Express.js 是一个 Node.js Web 应用程序服务器框架,专门用于构建单页、多页和混合 Web 应用程序。

它已成为 Node.js 的标准服务器框架。express 是 MEAN 堆栈的后端部分。

MEAN 是一个免费的开源JavaScript软件堆栈,用于构建动态网站和 Web 应用程序,具有以下组件;

  1. MongoDB - 标准的 NoSQL 数据库

  2. Express.js - 默认的 Web 应用程序框架

  3. ** Angular.js** - 用于 Web 应用程序的 JavaScript MVC 框架

  4. Node.js - 用于可扩展服务器端和网络应用程序的框架。

Express.js 框架使得开发一个可以用来处理多种类型请求的应用程序变得非常容易,例如 GET,PUT,POST 和 DELETE 请求。

安装和使用 Express

Express 通过 Node Package 管理器安装。这可以通过在命令行中执行以下行来完成

npm install express

上面的命令请求 Node 包管理器下载所需的 express 模块,并相应地安装它们。

让我们使用我们新安装的 Express 框架并创建一个简单的 Hello World 应用程序。

我们的应用程序将创建一个简单的服务器模块,它将侦听端口号 3000。在我们的示例中,如果通过此端口上的浏览器发出请求,则服务器应用程序将向客户端发送 Hello'World 响应。

var express=require('express');
var app=express();
app.get('/',function(req,res)
{
res.send('Hello World!');
});
var server=app.listen(3000,function() {});

代码说明:

  1. 在我们的第一行代码中,我们使用 require 函数来包含 express 模块。
  2. 在我们开始使用 express 模块之前,我们需要创建 express 模块的对象。 这里我们创建一个回调函数。只要有人浏览我们的 Web 应用程序的根目录,即 http:// localhost:3000,就会调用此函数。回调函数将用于将字符串 Hello World 发送到网页。
  3. 在回调函数中,我们将字符串 Hello World 发送回客户端。 res 参数用于将内容发送回网页。这个 res 参数是 request 模块提供的,用于能够将内容发送回网页。
  4. 然后我们使用 listen 函数使我们的服务器应用程序在端口号 3000 上侦听客户端请求。你可以在此处指定任何可用端口。

如果命令执行成功,则在浏览器中运行代码时看到 Hello World 显示在网页中。

  • 你可以清楚地看到,如果浏览 localhost URL 的端口 3000,你将看到页面中显示的字符串 Hello World
  • 因为在我们的代码中我们专门提到服务器要侦听端口号 3000,我们能够在浏览到这个 URL 时查看输出。

什么是路由?

路由指的是确定应用程序响应对特定端点的客户端请求的方式。

例如,客户端可以为各种 URL 进行 GET,POST,PUT 或 DELETE http 请求,如下图所示;

http://localhost:3000/Books

http://localhost:3000/Students

在上面的例子中,

  • 如果对第一个 URL 发出 GET 请求,则理想情况下响应应该是书籍列表。
  • 如果对第二个 URL 发出 GET 请求,则理想情况下响应应该是学生列表。
  • 因此,根据访问的 URL,将调用 Web 服务器上的不同函数,因此响应将发送到客户端。这是路由的概念。

每个路由都可以有一个或多个处理函数,这些函数在路由匹配时执行。

路由的一般语法如下所示

app.METHOD(PATH, HANDLER)

其中,

  1. app 是快递模块的一个实例

  2. METHOD 是一种 HTTP 请求方法(GET,POST,PUT 或 DELETE)

  3. PATH 是服务器上的路由。

  4. HANDLER 是匹配路由时执行的功能。

让我们看一下如何在 express 中实现路由的示例。我们的例子将创建 3 个路由,

  1. /Node 路由,如果访问此路由,将显示字符串 Tutorial on Node
  2. /Angular 路由,如果访问此路由,将显示字符串 Tutorial on Angular
  3. 默认路由将显示字符串 Welcome to Tastones Tutorials

我们的基本代码将与之前的示例保持一致。下面的代码片段用于说明如何实现路由。

var express = require('express');
var app = express();
app.route('/Node',get(function(req,res)
{
    res.send("Tutorial on Node");
});
post(function(req,res)
{
    res.send("Tutorial on Angular");
});
put(function(req,res)
{
    res.send('Welcome to Tastones Tutorials');
}));

代码说明:

  1. 如果在浏览器中选择了 URL http://localhost:3000/Node,我们在这里定义路由。对于路由,我们附加了一个回调函数,当我们浏览到节点 URL 时将调用该函数。 该函数有 2 个参数,
    • 我们将使用的主要参数是 res 参数,可用于将信息发送回客户端。
    • req 参数包含有关正在进行的请求的信息。有时,附加参数可以作为正在进行的请求的一部分发送,因此 req 参数可用于查找正在发送的附加参数。
  2. 如果选择了 Node 路由,我们使用 send 函数将字符串 Tutorial on Node 发送回客户端。
  3. 如果在浏览器中选择了 URL http://localhost:3000/Angular,我们在这里定义一个路由。对于路由,我们附加了一个回调函数,当我们浏览到 Angular URL 时将调用该函数。
  4. 如果选择了 Angular 路由,我们使用 send 函数将字符串 Tutorial on Angular 发送回客户端。
  5. 这是当浏览应用程序的路由时选择的默认路由 - http://localhost:3000。选择默认路由后,将向客户端发送消息 Welcome to Tastones Tutorials

在浏览器中输入 http://localhost:3000,如果命令执行成功,则在浏览器中运行代码时将显示 Welcome to Tastones Tutorials

  • 你可以清楚地看到,如果我们浏览到端口 3000 上的 localhost 的 URL,你将看到页面上显示的字符串 Welcome to Tastones Tutorials
  • 因为在我们的代码中,我们已经提到我们的默认 URL 会显示此消息。

在浏览器中输入 http://localhost:3000/Node,它将选择相应的节点路由,并显示字符串 Tutorial On Node

在浏览器中输入 http://localhost:3000/Angular,它则将选择相应的节点路由,并显示字符串 Tutorial On Angular

使用 express.js 的示例 Web 服务器

从上面的例子中,我们已经看到我们如何根据路由决定要显示的输出。这种路由是大多数现代 Web 应用程序中使用的路由。Web 服务器的另一部分是关于在 Node.js 中使用模板。

在创建快速动态节点应用程序时,一种简单快捷的方法是为应用程序使用模板。市场上有许多用于制作模板的框架。在我们的例子中,我们将以玉石框架为例进行模板化。

Jade 通过 npm 安装。这可以通过在命令行中执行以下行来完成

npm install jade

上面的命令请求 Node 包管理器下载所需的 jade 模块并相应地安装它们。

注意: 最新版本的 Node jade 已被弃用,你应该使用 pug

让我们使用我们新安装的 jade 框架并创建一些基本模板。

步骤 1: 第一步是创建一个 jade 模板。创建一个名为 index.jade 的文件并插入以下代码

html
	head
	  title!=title
	  
	  body
	  
	    h1=message
  1. 这里我们指定页面的标题将被更改为调用此模板时传递的任何值。
  2. 我们还指定标头标签中的文本将被替换为在 jade 模板中传递的任何内容。
var express=require('express');
var app=express();
app.set('view engine','jade');
app.get('/',function(req,res)
{
res.render('index',
{title:'Tastones',message:'Welcome'})
});
var server=app.listen(3000,function() {});

代码说明:

  1. 在应用程序中指定的第一件事是 view engine,它将用于呈现模板。由于我们将使用 jade 来渲染我们的模板,因此我们相应地指定它。
  2. 渲染功能用于渲染网页。在我们的示例中,我们正在渲染之前创建的模板 index.jade
  3. 我们将 TastonesWelcome 的值分别传递给参数 titlemessage。这些值将被 index.jade 模板中声明的 titlemessage 参数替换。

如果命令执行成功,则在浏览器中运行代码时将显示以下输出。

  • 我们可以看到页面标题设置为 Tastones,页面的 h1 被设置为 Welcome
  • 这是因为在我们的 Node.js 应用程序中调用了 jade 模板。

本节概要

  • express 框架是用于开发 Node.js 应用程序的最常用框架。express 框架构建在 Node.js 框架之上,有助于快速跟踪基于服务器的应用程序的开发。
  • 路由用于根据请求将用户转移到 Web 应用程序的不同部分。每条路由的响应可以根据需要向用户显示的内容而变化。
  • 模板可用于以有效的方式注入内容。Jade 是 Node.js 应用程序中最常用的模板引擎之一。