返回顶部
首页 > 资讯 > 前端开发 > VUE >Node.js中怎么使用Express4.x框架
  • 577
分享到

Node.js中怎么使用Express4.x框架

2024-04-02 19:04:59 577人浏览 独家记忆
摘要

这篇文章将为大家详细讲解有关node.js中怎么使用Express4.x框架,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。Web应用创建首先要做的是下载ex

这篇文章将为大家详细讲解有关node.js中怎么使用Express4.x框架,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。

Web应用创建

首先要做的是下载express并引用

npm install express --save

全局安装就+个-g

引用express

var express = require('express');
var app = express();

通过app我们就可以使用各种express的api

在3.x版本的时候是这样写的

var app =express.createServer();

现在这个函数已经被抛弃了

下面正式创建应用

//app.js
var express = require('express');
var app = express();
app.get('/', function(req, res){
 res.send('Express');
});
app.listen(3000);

启动之后就能给够在页面看到效果

node app.js

Node.js中怎么使用Express4.x框架

app.get()

上面的app.listen()就不多说了

用于监听端口

app.get(path, function(req, res){ })

用于用于处理客户端向服务器发送的GET请求

path表示请求的路径

回调函数的req和res是request和response的意思

request表示客户端发送的Http请求信息

response表示服务器发送的HTTP响应信息

使用res.send()可以向客户端发送信息

//app.js
var express = require('express');
var app = express();

app.get('/', function(req, res){
 res.send('<h2>Express</h2>');
});
app.get('/demo', function(req, res){
 res.send('<h2>Demo</h2>');
})
app.get('/*', function(req, res){
 res.send('<h2>404<h2>');
})

app.listen(3000);

Node.js中怎么使用Express4.x框架

Node.js中怎么使用Express4.x框架

app.post()

app.post(path, function(req, res){ })

用于用于处理客户端向服务器发送的POST请求

和GET请求不同,POST请求不会将信息放在url中

而是写入请求头中

它的解析有所不同,下面再说

app.all()

在此之前还要提一个概念——中间件

Middleware中间件在不同环境下有不同含义

而在我们express中,简单说它就是一个特殊的函数

用来处理HTTP请求的函数

并且它有一个特点——处理完一个中间件可以传递给下一个中间件来处理

funciton(req, res, next){
  ...
  next();
}

(如果不使用执行next函数,那么之后监听的函数也不会执行)

可以向next中传递字符串参数,代表抛出的错误信息

这样当数据往下传递的时候,中间件不再进行处理

直到找到一个错误处理函数为止

app.all(path, function(req, res, next){ })的使用中

就需要我们定义这样的中间件

这个方法可以过滤所有路径上的请求

换句话说,在其他所有的中间件处理之前

必须先通过app.all()的中间件进行处理

var express = require('express');
var app = express();

app.all('*', function(req, res, next){
 res.writeHead(200, ':)');
 next();
});

app.get('/', function(req, res){
 res.end('<h2>Express</h2>');
});
app.get('/demo', function(req, res){
 res.end('<h2>Demo</h2>');
})
app.get('/*', function(req, res){
 res.end('<h2>404<h2>');
})

app.listen(3000);

这样不论客户端向我们发出了什么样的路径请求

服务器响应信息前都会先打上响应头

app.use()

app.use([path, ]function(req, res, next){ })

这个方法一般情况是用来调用中间件的

与前面的函数不同,它的第一个path参数可以省略,默认'/'

app.use(express.static(path.join(__dirname, '/public')));

上面的这个用法就是指定静态文件的访问路径

通过next参数我们可以连续调用中间件函数

app.use(function(req, res, next){
 console.log(1);
 next();
});
app.use(function(req, res, next){
 console.log(2);
 next();
});
app.use(function(req, res, next){
 console.log(3);
});
app.use(function(req, res, next){
 console.log(4);
});

当发出网络请求的时候

控制台就会输出 1 2 3

因为第三个中间件没有调用next方法

所以处理到此为止

不会输出4

app.use()除了调用中间件

还可以根据请求路径的不同,返回不同信息

但我们一般不会这么用

//app.js
var express = require('express');
var app = express();

app.use(function(req, res, next){
 if(req.url == '/'){
  res.end('<h2>Express</h2>');
 }else{
  next();
 }
});
app.use(function(req, res, next){
 if(req.url == '/demo'){
  res.end('<h2>Demo</h2>');
 }else{
  next();
 }
});
app.use(function(req, res, next){
 res.end('<h2>404<h2>');
});

app.listen(3000);

请求与响应

上面express中每一个回调函数都不可缺少req和res参数

重要性可见一斑

常见的req与res中的属性/方法如下(原生node.js的req、res属性/方法也可以使用)

Request对象:

API含义
req.app当callback为外部文件时,用于访问express的实例
req.baseUrl获取路由当前安装的URL路径
req.body/cookies获得「请求主体」/ Cookies
req.fresh/stale判断请求是否还「新鲜」
req.hostname/ip获取主机名和IP地址
req.originalUrl获取原始请求URL
req.params获取路由的parameters
req.path获取请求路径
req.protocol获取协议类型
req.query获取URL的查询参数串
req.route获取当前匹配的路由
req.subdomains获取子域名
req.acceptsCharsets返回指定字符集的第一个可接受字符编码
req.acceptsEncodings返回指定字符集的第一个可接受字符编码
req.acceptsLanguages返回指定字符集的第一个可接受字符编码
req.accepts()检查可接受的请求的文档类型
req.get()获取指定的HTTP请求头
req.is()判断请求头Content-Type的MIME类型

Response对象:

API含义
res.app同req.app
res.append()追加指定HTTP头
res.set()在res.append()后将重置之前设置的头
res.cookie()设置Cookie
res.clearCookie()清除Cookie
res.download()传送指定路径的文件
res.get()返回指定的HTTP头
res.JSON()传送JSON响应
res.jsonp()传送JSONP响应
res.location()只设置响应的Location HTTP头,不设置状态码或者close response
res.redirect()设置响应的Location HTTP头,并且设置状态码302
res.send()传送HTTP响应
res.sendFile()传送指定路径的文件 -会自动根据文件extension设定Content-Type
res.set()设置HTTP头,传入object可以一次设置多个头
res.status()设置HTTP状态码
res.type()设置Content-Type的MIME类型

挑一些重点

req.query

req.query可以获取请求路径参数的对象

向服务器发送请求 http://localhost:3000/?user=tester&pass[a]=123&pass[b]=456

//app.js
var express = require('express');
var app = express();

app.get('/', function(req, res, next){
 console.log(req.query);
 console.log(req.query.user); //tester
 console.log(req.query.pass.a); //123
 console.log(req.query.pass.b); //456
 res.end();
});

app.listen(3000);

req.params

req.params可以解析复杂路由规则上的属性
(req.param综合了req.query和req.param的功能,但是被移除了不要使用)

向服务器发送请求 http://localhost:3000/123456

//app.js
var express = require('express');
var app = express();

app.get('/:id', function(req, res, next){
 console.log(req.params.id); //123456
 res.end();
});

app.listen(3000);

 这样不论我在根路径后输入的是什么

都会被解析为req.params.id

res.send()

res.send用于向客户端响应信息 并且它的强大之处在于可以智能的处理我们传递的不同类型参数

app.get('/', function(req, res, next){
 res.send('express');
});

当参数为字符串,会将响应头Content-Type默认设置为text/html

也就是解析为html呈现在我们的页面上

app.get('/', function(req, res){
 res.send(200);
});

当参数为数字,会自动帮我们设置响应体(状态码…)

app.get('/', function(req, res){
 res.send([1, 2, 3]);
});

当参数为数组或对象,它会响应一个JSON

res.redirect()

使用这个方法可以让我们对网页重定向

比如使用绝对url跳转到不同的域名

app.get('/', function(req, res){
 res.redirect('http://www.baidu.com');
});

res.redirect()默认响应状态码是302

可以更改这个状态码作为res.redirect()的第一个参数

//app.js
var express = require('express');
var app = express();

app.get('/', function(req, res){
 res.redirect(302, 'demo');
});
app.get('/demo', function(req, res){
 res.end();
});

app.listen(3000);

当在url地址栏中输入http://localhost:3000

页面就会重定向到http://localhost:3000/demo

静态资源

静态资源就是指我们在开发中用到的CSS、js、img等等

它们需要存放到一个静态资源目录

当浏览器发出了一个非HTML文件请求

服务器就会从这个静态资源目录下去查找文件

我们一般在根目录下创建一个public文件来存储

并在public中创建stylesheets、javascripts、images等文件夹

用来存储特定类型的资源

指定静态资源目录的方法上面已经提到了

var path = require('path');
app.use(express.static(path.join(__dirname, 'public')));

比如说我们的html中有这样的代码

<link href="/javascripts/Jquery.js" rel="external nofollow" rel="stylesheet" media="screen">

那么客户端运行发出请求

服务器就会在public的javascripts文件夹下找到jQuery.js静态资源

模板引擎

express框架默认是ejs和jade渲染模板

这里以jade为例

使用时肯定要下载

npm install jade --save

再通过app.set()指定查找模板文件的目录(类似于静态资源)

并指定模板文件后缀为jade

app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');

(如果不使用模板而使用原生html,app.set('view engine', 'html');)

如果我们想要访问模板该怎么做呢?

很简单,只需要一个方法res.render()

Node.js中怎么使用Express4.x框架

现在我写了一个简单的jade模板(关于jade语法超出本文讨论范围)

//views/index.jade
doctype html
html
 head
  title= title
  link(rel='stylesheet', href='/stylesheets/style.css')
 body
  h2= title
  p= content

通过res.render渲染

//app.js
var express = require('express');
var path = require('path');
var app = express();

app.use(express.static(path.join(__dirname, 'public')));

app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');

app.get('/', function(req, res){
 res.render('index', {
  title: 'Express',
  content: 'this is an example'
 });
});

app.listen(3000);

Node.js中怎么使用Express4.x框架

res.render()

res.render(view[, datas][, callback])

用于对网页模板进行渲染

第一个参数是要渲染的模板名称

第二个参数是传递给模板的变量,以对象形式存储,没有可省略

第三个参数是渲染后回调函数,可以省略

路由

路由的意思就是根据不同的路径,来指定不同的处理方法

我们一般把不同的路由封装进不同的模块

首先在根目录下创建一个文件夹routes存储路由

现在我在routes文件夹下创建俩个路由文件index.js和users.js

Node.js中怎么使用Express4.x框架

修改app.js

//app.js
var express = require('express');
var path = require('path');
var app = express();

var index = require('./routes/index');
var users = require('./routes/users');

app.use('/', index);
app.use('/users', users);

app.listen(3000);

这样表示http://localhost:3000/的路由交给index处理

http://localhost:3000/users的路由交给users处理

下面简单的实现一下路由

//routes/index.js
var express = require('express');
var router = express.Router();

router.get('/', function(req, res){
 res.end('index');
});

router.get('/123', function(){
 res.end(123);
});

module.exports = router;
//routes/users.js
var express = require('express');
var router = express.Router();

router.get('/', function(req, res) {
 res.end('users');
});

module.exports = router;

通过express.Router()创建的router就像一个mini版的app一样

app能做的,router都能做

只是我们把逻辑都封装到了各个路由模块中

上面代码的结果:

Node.js中怎么使用Express4.x框架

Node.js中怎么使用Express4.x框架

Node.js中怎么使用Express4.x框架

body-parser中间件

作为一个入门级文章

最后就来浅显的谈一个中间件body-parser吧

其实express在3.x版本中内置了很多中间件

但是4.x版本就将出static以外的所有中间件全部抽离出来了

所以就需要我们单独安装

对照表如下:

Express 3.0Express 4.0
bodyParserbody-parser
compresscompression
cookieSessioncookie-session
loggermorgan
cookieParsercookie-parser
sessionexpress-session
faviconstatic-favicon
response-timeresponse-time
error-handlererrorhandler
method-overridemethod-override
timeoutconnect-timeout
vhostvhost
csrfcsurf

刚才就提到了POST请求有所不同

不同的地方就在于我们需要body-parser这个中间件来处理数据

通过req.body来获得数据

首先使用前不要忘记下载

npm install body-parser --save
//app.js
var express = require('express');
var bodyParser = require('body-parser');
var path = require('path');
var app = express();

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));

app.get('/', function(req, res){
 res.send('<fORM method="POST" action="./form">\
       <input type="text" name="user">\
       <input type="submit">\
      </form>');
});
app.post('/form', function(req, res){
 console.log(req.body);
 var user = req.body.user;
 res.send('账号: ' + user);
});

app.listen(3000);

下面这四个方法分别用于对body内容采取不同的处理方法

  1. bodyParser.json(options) 处理JSON数据

  2. bodyParser.raw(options) 处理buffer数据

  3. bodyParser.text(options) 处理文本数据

  4. bodyParser.urlencoded(options) 处理UTF-8编码数据

这样我首先通过get请求获取主页面

Node.js中怎么使用Express4.x框架

提交表单向服务器发送post请求

Node.js中怎么使用Express4.x框架

服务器响应结果

express-generator

通过express-generator应用生成器

可以为我们快速生成项目雏形

在你要生成项目的目录中下载express-generator

npm install express-generator

然后输入

express <项目文件名>

这样express就会把必要的文件夹以及代码快速生成了

Node.js中怎么使用Express4.x框架

关于Node.js中怎么使用Express4.x框架就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到。

--结束END--

本文标题: Node.js中怎么使用Express4.x框架

本文链接: https://lsjlt.com/news/74388.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • Node.js中怎么使用Express4.x框架
    这篇文章将为大家详细讲解有关Node.js中怎么使用Express4.x框架,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。Web应用创建首先要做的是下载ex...
    99+
    2024-04-02
  • 浅谈Node.js轻量级Web框架Express4.x使用指南
    Express是一个轻量级的Web框架,简单、灵活 也是目前最流行的基于Nodejs的Web框架 通过它我们可以快速搭建功能完整的网站 (express 英文意思:特快列车) Express现在是4...
    99+
    2022-06-04
    浅谈 使用指南 框架
  • Node.Js框架怎么使用
    本篇内容介绍了“Node.Js框架怎么使用”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!   项目前期准...
    99+
    2024-04-02
  • Vite中怎么使用Ant Design Vue3.x框架
    今天小编给大家分享一下Vite中怎么使用Ant Design Vue3.x框架的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我...
    99+
    2023-07-02
  • Node.js中Koa框架怎么用
    这篇文章主要介绍“Node.js中Koa框架怎么用”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“Node.js中Koa框架怎么用”文章能帮助大家解决问题。KoaKoa 是为了解决 ...
    99+
    2023-06-17
  • Node.js中Express框架怎么用
    本篇内容主要讲解“Node.js中Express框架怎么用”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“Node.js中Express框架怎么用”吧!很多语言都有一些框架,这些框架可以帮助我们更...
    99+
    2023-06-17
  • Node.js的Koa框架怎么使用
    这篇文章主要介绍“Node.js的Koa框架怎么使用”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“Node.js的Koa框架怎么使用”文章能帮助大家解决问题。KoaKoa 是为了解决&nb...
    99+
    2023-07-04
  • Node.js的Express框架怎么使用
    本文小编为大家详细介绍“Node.js的Express框架怎么使用”,内容详细,步骤清晰,细节处理妥当,希望这篇“Node.js的Express框架怎么使用”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。目前比较流...
    99+
    2023-07-04
  • Node.js 中如何使用Express框架
    这期内容当中小编将会给大家带来有关Node.js 中如何使用Express框架,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。Node.js Express 框架Expre...
    99+
    2024-04-02
  • Node.js中Express框架怎么使用axios同步请求
    这篇文章主要介绍了Node.js中Express框架怎么使用axios同步请求的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇Node.js中Express框架怎么使用axios同步请求文章都会有所收获,下面我们...
    99+
    2023-07-06
  • node.js之koa框架怎么用
    这篇文章将为大家详细讲解有关node.js之koa框架怎么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。Koa -- 基于 Node.js 平台的下一代 web 开发框...
    99+
    2024-04-02
  • Node.js中Express框架的使用教程详解
    目录Express简介Express生成器1. 什么是Express生成器2. 安装Express生成器创建Express项目安装项目依赖运行Express项目Express目录结构...
    99+
    2024-04-02
  • Vite中使用Ant Design Vue3.x框架教程示例
    目录引言安装 ant-design-vuemain.js引入,全局使用按需引入引言 官网: https://www.antdv.com/docs/vue/introduce-cn 文...
    99+
    2024-04-02
  • Node.js中怎么实现一个express框架
    本篇文章给大家分享的是有关Node.js中怎么实现一个express框架,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。express的基本用法...
    99+
    2024-04-02
  • Node.js网络框架koacompose中间件使用解析
    目录前言koa-compose洋葱模型源码解析总结前言 学习目标: koa-compose洋葱模型 源码地址:koajs/compose koa-compose Koa-compo...
    99+
    2022-12-25
    Node.js框架koa compose中间件 Node.js koa-compose
  • Gin框架中bind怎么使用
    本篇内容主要讲解“Gin框架中bind怎么使用”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“Gin框架中bind怎么使用”吧!概述Gin框架中,有bind函数可以非常方便的将url的查询参数qu...
    99+
    2023-06-22
  • Java中怎么使用Sinatra框架
    这篇文章主要讲解了“Java中怎么使用Sinatra框架”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“Java中怎么使用Sinatra框架”吧!Sinatra 是一个微型的 Ruby 语言的...
    99+
    2023-06-17
  • Golang中tinyrpc框架怎么使用
    本篇内容介绍了“Golang中tinyrpc框架怎么使用”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!tinyrpc功能tinyrpc基于T...
    99+
    2023-07-05
  • gin框架中怎么使用JWT
    这篇文章主要讲解了“gin框架中怎么使用JWT”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“gin框架中怎么使用JWT”吧!什么是JWT?JWT全称JSON Web Token是一种跨域认证...
    99+
    2023-06-30
  • Java中怎么使用Nutz框架
    使用Nutz框架在Java中进行开发可以按照以下步骤进行:1. 导入Nutz框架的相关依赖:在项目的构建文件(如Maven的pom....
    99+
    2023-08-24
    Java Nutz
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作