Ecpress 路由

最新推荐文章于 2024-02-01 16:37:57 发布

ILove_bugs

最新推荐文章于 2024-02-01 16:37:57 发布

阅读量343

点赞数

分类专栏： Nodejs 文章标签： javascript 前端 node.js

本文链接：https://blog.csdn.net/ilove_bugs/article/details/121107539

版权

Nodejs 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

一、简介

Express是基于基于 Nodejs平台，快速、开放、极简的 Web 开发框架【后端框架】。

中文地址：Express - 基于 Node.js 平台的 web 应用开发框架 - Express 中文文档 | Express 中文网

官网地址：Express - Node.js web application framework

作用：使用 Express，我们可以方便、快速的创建 Web 网站的服务器或 API 接口(纯json数据)的服务器。

本质上：express是一个第三方包存在于npm社区中。

API（Application Programming Interface，应用程序接口）是一些预先定义的接口（如函数、HTTP接口），或指软件系统不同组成部分衔接的约定。

二、安装及基本使用

2.1 初始化项目并安装express

在项目根目录中安装express框架：

npm   i   express

2.2 初体验：express创建web服务器【重点】

const express = require('express');
// console.log(express);

//创建应用
const app = express();

//监听端口：
app.listen(3030, () => {
    console.log('web服务器工作在3030端口');
});

2.3 app对象【重点】

2.3.1 app.get( 路径,兼听函数 )

app.get()方法匹配以get方式发送的请求

注意：所有的路径都是以/开头

2.3.2 app.post(路径,兼听函数 )

app.post()方法匹配以post方式发送的请求

注意：所有的路径都是以/开头

2.3.3 app.all(路径,兼听函数 )

app.all()方法匹配所有请求方式发送的请求

注意：所有的路径都是以/开头

const express = require('express');
const fs = require('fs');
const path = require('path');
// console.log(express);

//创建应用
const app = express();
// console.log(app);

//监听端口：
app.listen(3030, () => {
    console.log('web服务器工作在3030端口');
});


//app对象上的方法：
//app.get('/路径',回调函数)：获取以get方式发送的请求
//req:request请求对象
//res:response响应对象
app.get('/', (req, res) => {
    // console.log(req, res);

    // res.setHeader('content-type', 'text/html;charset=utf-8');
    // res.end('这是首页面');
    res.send('这是首页面'); //相当nodejs中的res.setHeader()和res.end();
});


//学生界面
app.get('/student', (req, res) => {

    res.send('这是学生界面');
});

//老师界面
app.get('/teacher', (req, res) => {

    res.send('老师界面');
});


// app.all('/zhuce', (req, res) => {

//     res.send('all()方法');
// });


//处理注册用户
app.post('/zhuce', (req, res) => {

    res.send('处理注册');
});


//处理404错误的
app.all('*', (req, res) => {

    // let content = fs.readFileSync(path.join(__dirname, '3-404.html'));

    // res.end(content);

    // res.send('404错误');

    res.sendFile(path.join(__dirname, '404.html'));
})

404.html文件内容如下：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div>Sorry,页面可能跑到火星上了^__^!!!!</div>
</body>

</html>

2.4 response对象【重点】

2.4.1 res.send( 字符串|对象 )。

res.send()相当于原生nodejs中的res.setHeader()和res.end()这两个方法。

注意：res.send()说法只同时执行一次，否则会报错：Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client

将对象或字符串作为响应内容返回给客户端。

const express = require('express');

//创建应用
const app = express();


//监听端口：
app.listen(3030, () => {
    console.log('web服务器工作在3030端口');
});


//处理注册用户
app.post('/zhuce', (req, res) => {

    // res.send('处理注册');
    res.send({ "status": 500, "msg": "帐号已注册过" });
});

2.4.2 res.sendFile( absolute filepath )

将某个文件内容读取出来并作为响应内容返回给客户端。

const express = require('express');
const fs = require('fs');
const path = require('path');

//创建应用
const app = express();
// console.log(app);

//监听端口：
app.listen(3030, () => {
    console.log('web服务器工作在3030端口');
});


//处理404错误的
app.all('*', (req, res) => {

    // 原生nodejs的写法：
    // let content = fs.readFileSync(path.join(__dirname, '3-404.html'));
    // res.end(content);

    res.sendFile(path.join(__dirname, '404.html'));
})

404.html文件内容如下：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div>Sorry,页面可能跑到火星上了^__^!!!!</div>
</body>

</html>

2.5 request对象【重点】

2.5.1 req.query

req.query用来接收get方式的查询字符串格式发送的参数，查询字符串格式发送的参数如下：

在注意器地址栏中输入网址：http://localhost:3030/zhuce?uname=lisi&pwd=123&repwd=123

接收上面get方式的查询字符串格式发送的参数，代码如下：

const express = require('express');

//创建应用
const app = express();
// console.log(app);

//监听端口：
app.listen(3030, () => {
    console.log('web服务器工作在3030端口');
});

app.get('/mydemo', (req, res) => {

    //console.log(req.query);
    let { uname,repwd,pwd } = req.query;  //接收get方式的查询字符串格式发送的参数
    res.send(`参数为:${JSON.stringify(req.query)}  ${uname} ${pwd} ${repwd}`);
})

2.5.2 req.params

接收get方式的path路径格式发送的参数，path路径格式发送的参数如下：

在浏览器地址栏中输入地址：http://localhost:3030/mytest/lisi/123/123

接收上面get方式的查询字符串格式发送的参数，代码如下：

const express = require('express');

//创建应用
const app = express();
// console.log(app);

//监听端口：
app.listen(3030, () => {
    console.log('web服务器工作在3030端口');
});

app.get('/mytest/:uname/:pwd/:repwd', (req, res) => {
    console.log(req.params);
    let { uname, pwd, repwd } = req.params;
    res.send(`接收path路径格式发送的参数:${JSON.stringify(req.params)}`);
});

三、工具的使用

3.1 nodemon热更新工具【重点】

当我们的nodejs代码有修改时每次都要停止、重新运行代码才生效，这样有点麻烦，如果使用ndoemon热更新工具来运行我们的代码时当nodejs代码有修改时则nodemon热更新工具则自动停止并重新运行代码。

安装nodemon热更新工具：

npm  i   nodemon -g

注意：关于-g参数的使用说明

1)、当使用-g参数安装某个包时可以在dos小黑窗中的任意目录中执行npm安装命令；

2)、以-g参数安装的包的存放位置：

C:\Users\当前用户名\AppData\Roaming\npm

3)、使用-g参数安装的包在同一台电脑中只需要安装一次即可；

以热更新nodemon方式运行某个nodejs程序文件，如下：

F:\web_zhengzhou\day07\代码>nodemon 1-使用express搭建web服务器.js

3.2 vscode的Rest Client插件【重点】

vscode开发工具的Rest Client插件用来模块http各种请求方式来发送请求，在发送请求的同时也可以带参数。

第一步：在vscode开发工具中安装Rest Client插件；

第二步：在当前项目的任意目录创建以.http结尾的文件，比如：创建demo.http；

第三步：在demo.http创建要调度、调用的接口程序，格式如下：

@hosts = http://localhost:3000



POST {{hosts}}/login HTTP/1.1


###

POST {{hosts}}/tongbu HTTP/1.1

###
GET {{hosts}}/register?uname=lisi&mima=456 HTTP/1.1

###
GET  {{hosts}}/demo/张三/zhangsan@qq.com HTTP/1.1

四、路由

4.1 路由概述

4.1.1 什么是路由？【重点】

广义上来讲，路由就是映射关系。对于我们网络请求中的路由是：每一次请求对应每一个请求处理的函数。

路由就是根据请求中的不同路径返回不同的响应，比如：用户在浏览器地址栏中输入http://localhost:3000/teacher则想看到结果(响应)为老师界面，用户在浏览器地址栏中输入http://localhost:3000/student则想看到结果(响应)为学生界面。

4.1.2 现实中的路由

4.1.3 路由的作用

路由来区别不同的业务。

在express框架中设计路由的方式有两种：【重点】

第一种：使用app对象提供的方法：app.get()、app.post()、app.all()

第二种：采用模块化路由方式来设计路由：router.get()、router.post()、router.all()

4.2 Express中的路由（Node的路由）

语法：

app.method( path,callback )

参数说明：

method：代表请求方式，比如:app.get()，app.post()、app.all()

path：代表请求路径

callback：代表回调函数，用户请求匹配到路由以后要做的事情。

4.2.1 匹配流程

4.3 express.Router 模块化路由【重点】

第一步：定义模块化路由文件(users.js)并使用模块化方式设计路由：

    const express  = require('express');

    const router     = express.Router();



    //设计路由：router.get()、router.post()、router.all();



   //暴露router对象：

   module.exports = router

第二步：在入口文件中引入上面定义好的模块化路由文件(users.js)并使用：

app.use([路径，]回调函数)

const express = require('express');

//创建应用  
const app = express();
// console.log(app);  

//监听端口：  
app.listen(3000, () => {
    console.log('web服务器工作在3000端口');
});


//引入自定义的路由模块文件：
let userRouter = require('./users.js');
// console.log(userRouter);
//使用模块化方式设计的路由
app.use(userRouter);

ILove_bugs

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Ecpress 路由

一、简介Express是基于基于 Nodejs平台，快速、开放、极简的 Web 开发框架【后端框架】。中文地址：Express - 基于 Node.js 平台的 web 应用开发框架 - Express 中文文档 | Express 中文网官网地址：Express - Node.js web application framework作用：使用 Express，我们可以方便、快速的创建 Web 网站的服务器或 API 接口(纯json数据)的服务器。本质上：express是一个第三方包存
复制链接

扫一扫