express的使用

最新推荐文章于 2024-03-29 05:42:53 发布

qq_43367379

最新推荐文章于 2024-03-29 05:42:53 发布

阅读量238

点赞数

分类专栏：总结文章标签： javascript 前端 json

本文链接：https://blog.csdn.net/qq_43367379/article/details/126067471

版权

总结专栏收录该内容

11 篇文章 0 订阅

订阅专栏

一、简单介绍

Express 是一个基于 Node.js 平台，快速、开放、极简的 web 开发框架，它提供一系

列强大的特性，帮助你创建各种 Web 和移动设备应用。

二、安装使用

1.初始化项目

npm init --yes

2.安装

npm install express --save

3.简单使用

//引入
const express = require("express");

const app = express();

//配置路由
app.get('/',(req,res)=>{
    res.send("hello express");
});
//监听端口
app.listen(8080);

三、框架中的路由

路由（Routing）是由一个 URI（或者叫路径）和一个特定的 HTTP 方法（GET、POST 等）组成的，涉及到应用如何响应客户端对某个网站节点的访问

基础路由

//显示数据
app.get("路由",(req,res)=>{
	
});
// 提交数据
app.post("路由",(req,res)=>{
	
});
// 修改数据
app.put("路由",(req,res)=>{
	
});
// 删除数据
app.delete("路由",(req,res)=>{
	
});

动态路由配置

app.get("/user/:id",function(req,res){
	let id = req.params["id"];
	res.send(id);
})
比如访问 /user/edit
则id = edit

路由的正则匹配

app.get('/ab*cd',(req,res)=>{
	res.send('ab*cd');
});

路由里面获取get传值

/news?id=2&sex=nam

app.get('/news',(req,res)=>{
    console.log(req.query);
})

四、使用ejs

1.安装ejs

npm install ejs --save

2.在ejs中使用

// 引入
const express = require("express");
const app = express();

// 配置
app.set("view engine","ejs");

// 配置路由
app.get("/",(req,res)=>{
    let list = ["1","2","3"];
    let message = "绑定数据成功";
    let nums = [{
        name: "张三",
        age : 23
    },{
        name: "李四",
        age : 24
    }]
    // 第一个参数是 页面的名字，第二个参数是传递的数据
    res.render("index",{
        list: list,
        message: message,
        nums: nums
    })
})
// 监听端口
app.listen(8080);

指定模板位置，默认模板位置在vies目录

app.set('views', __dirname + '/views');

index.ejs页面

<!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>
    <p>
        消息：<%= message%>
    </p>
    <ul>
        <% for (let i=0;i<list.length;i++){%>
            <li>
                <%= list[i]%>
            </li>
        <%}%>
    </ul>
    <ul>
        <% for (let i=0;i<nums.length;i++){%>
            <li>
                <%= nums[i].name%>------<%= nums[i].age%>
            </li>
        <%}%>
    </ul>
</body>
</html>

其他模板规则

引入一整个文件
<%- include (‘header.ejs’) %>
绑定数据
<%= 绑定的数据名%>
绑定html数据
<%- 数据%>
判断
<% if(true){ %> 
    <div>true</div> 
 <% } else{ %> 
     <div>false</div> 
 <% } %>
循环
<%for(var i=0;i<list.length;i++) { %> 
    <li><%= list[i] %></li> 
<% } %>

ejs后缀修改为html

1.在 app.js 的头上定义 ejs:,代码如下: 
var ejs = require('ejs'); 
2.注册 html 模板引擎代码如下：
app.engine('html',ejs.__express);
3.将模板引擎换成 html 代码如下:
app.set('view engine', 'html');
4.修改模板文件的后缀为.html。

访问静态文件

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

可以直接访问public下的文件

虚拟路径通过/static 访问 public 目录

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

五、中间件

中间件就是匹配路由之前或者匹配路由完成做的一系列操作，中间件如果想要继续往下执行，需要next()

中间件的功能：

执行任何代码。

修改请求和响应对象。

终结请求-响应循环。

调用堆栈中的下一个中间件。

1.应用级中间件(用于过滤请求)

//应用级中间件
/*匹配任何路由*/
app.use((req,res,next)=>{
    console.log(new Date());
     next(); /*表示匹配完成这个中间件以后程序继续向下执行*/
})

2.路由级中间件(用的很少)

app.get("/",function(req,res,next){ 
    console.log("1"); 
    next(); 
});

3.错误处理中间件(所有路由的后面)

// 错误处理中间件
app.use((req,res)=>{
    res.status(404).render("页面未找到",{});
});

4.内置中间件

//静态服务 index.html 
app.use('/static',express.static("./static")); /*匹配所有的路径*/ app.use('/news',express.static("./static")); /*匹配所有的路径*/

5.第三方中间件

body-parser 中间件第三方的获取 post 提交的数据

使用

npm install body-parser --save

配置

const bodyParser = require("body-parser");
// 配置body-parser
app.use(bodyParser.urlencoded({ extended: false })); 
app.use(bodyParser.json());

使用 req.body

app.post("/dologin",(req,res)=>{
   var body = req.body;  
   res.send(body.username);
  //  res.send("提交数据成功");
});

六、cookie

1.cookie简介

● cookie 是存储于访问者的计算机中的变量。可以让我们用同一个浏览器访问同一个域名的时候共享数据。

● HTTP 是无状态协议。简单地说，当你浏览了一个页面，然后转到同一个网站的另一个页面，服务器无法认识到这是同一个浏览器在访问同一个网站。每一次的访问，都是没有任何关系的。

● Cookie 是一个简单到爆的想法：当访问一个页面的时候，服务器在下行 HTTP 报文中，命令浏览器存储一个字符串; 浏览器再访问同一个域的时候，将把这个字符串携带到上行HTTP 请求中。第一次访问一个服务器，不可能携带 cookie。必须是服务器得到这次请求在下行响应报头中，携带 cookie 信息，此后每一次浏览器往这个服务器发出的请求，都会携带这个cookie

2.cookie特点

● cookie 保存在浏览器本地

● 正常设置的 cookie 是不加密的，用户可以自由看到;

● 用户可以删除 cookie，或者禁用它

● cookie 可以被篡改

● cookie 可以用于攻击

● cookie 存储量很小。未来实际上要被 localStorage 替代，但是后者 IE9 兼容。

3.使用cookie

3.1 安装

npm install cookie-parser --save

3.2 引入

const cookieParser = require("cookie-parser");

3.3 设置中间件

app.use(cookieParser());

3.4 设置cookie

 // cookie的名字是username，value是zhangsan，过期时间1s*60*2
res.cookie("username","zhangsan",{maxAge:1000*60*2});

3.5 获取cookie

let username = req.cookies.username;
res.send("获取的cookie:"+username);

完整的js

const express = require("express");
const app = express();
const cookieParser = require("cookie-parser");

// 设置中间件
app.use(cookieParser());

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

    // cookie的名字是username，value是zhangsan，过期时间1s*60*2
    res.cookie("username","zhangsan",{maxAge:1000*60*2});
    res.send("首页")
});

app.get("/user",(req,res)=>{
    // 获取cookie
    let username = req.cookies.username;
    res.send("获取的cookie:"+username);
});


app.listen(8080);

4.cookie属性

属性	描述
domain	域名 name=value：键值对，可以设置要保存的 Key/Value，注意这里name 不能和其他属性项的名字一样
Expires	过期时间（秒），在设置的某个时间点后该 Cookie 就会失效，如 expires=Wednesday, 09-Nov-99 23:12:40 GMT
maxAge	最大失效时间（毫秒），设置在多少后失效
secure	当 secure 值为 true 时，cookie 在 HTTP 中是无效，在 HTTPS 中才有效
Path	表示 cookie 影响到的路路径，如 path=/。如果路径不能匹配时，浏览器则不发送这个 Cookie
httpOnly	是微软对 COOKIE 做的扩展。如果在 COOKIE 中设置了“httpOnly”属性，则通过程序将无法读取到 COOKIE 信息，防止 XSS 攻击产生
singed	表示是否签名 cookie, 设为 true 会对这个 cookie 签名，这样就需要用 res.signedCookies 而不是 res.cookies 访问它。被篡改的签名 cookie 会被服务

5.加密cookie

1.配置中间件时需要传递参数

var cookieParser = require('cookie-parser'); app.use(cookieParser('123456'));
// 参数可以是任意的 也可以是特定的

2.设置cookie的时候配置signed属性

res.cookies("username","zhangsan",{maxAge:1000*60*5,signed:true})

3.signedCookies获取cookie

req.signedCookies.

这样设置的cookie，如果用浏览器的控制台(F12)修改了cookie值，那么就再获取cookie值就为false，而不是设置的cookie值

七、session

1.简单介绍

session 是另一种记录客户状态的机制，不同的是 Cookie 保存在客户端浏览器中，而session 保存在服务器上。

Cookie 数据存放在客户的浏览器上，Session 数据放在服务器上。Session 相比 Cookie 要更安全一些。由于 Session 保存到服务器上，所以当访问量增多的时候，会比较占用服务器的性能。单个 cookie 保存的数据大小不能超过 4K，很多浏览器都限制一个站点最多保存 20个 cookie。Session 没有这方面的限制。Session 是基于 Cookie 进行工作的。

2.工作流程

当浏览器访问服务器并发送第一次请求时，服务器端会创建一个 session 对象，生成一个类似于 key,value 的键值对，然后将 key(cookie)返回到浏览器(客户)端，浏览器下次再访问时，携带 key(cookie)，找到对应的 session(value)。

3.express-session的使用

安装

npm install express-session --save

引入

const session = require("express-session");

设置

app.use(session({
    secret: 'keyboard cat',// 服务端生成session的签名
    resave: false,     // 强制保存session 即使它没有变化
    saveUninitialized: true, // 强制将未初始化的session存储
    cookie: { secure: false }
  }))

使用

设置值 req.session.xxx = "sds"
获取值 req.session.xxx

4.常用参数

app.use(session({ 
    secret: '12345', 
    name: 'username', 
    cookie: {
        maxAge: 60000
    }, 
    resave: false, 
    saveUninitialized: true 
}));

secret

一个 String 类型的字符串，作为服务器端生成 session 的签名。

name

返回客户端的 key 的名称，默认为 connect.sid,也可以自己设置。

resave

强制保存 session 即使它并没有变化,。默认为 false。

saveUninitialized

强制将未初始化的 session 存储。当新建了一个 session 且未设定属性或值时，它就

处于未初始化状态。在设定一个 cookie 前，这对于登陆验证，减轻服务端存储压力，权

限控制是有帮助的。（默认：true）。建议手动添加。

cookie

设置返回到前端 key 的属性，默认值为{ path: ‘/’, httpOnly: true, secure: false,maxAge: null }。

rolling

在每次请求时强行设置 cookie，这将重置 cookie 过期时间（默认：false）

5.常用方法

req.session.destroy(function(err) { })       /*销毁 session*/ 
req.session.username='张三'; //设置 session 
req.session.username //获取 session 
req.session.cookie.maxAge=0; //重新设置 cookie 的过期时间

6.保存到数据库

以官网的文档为准，有一些方法被更新了

1.需要安装 express-session 和 connect-mongo 模块 
npm install connect-mongo --save
2.引入模块 
var session = require("express-session"); 
const MongoStore = require('connect-mongo'); 
3.配置中间件 
app.use(session({ 
    secret: 'keyboard cat', 
    resave: false, 
    saveUninitialized: true, 
    rolling:true, 
    cookie:{ maxAge:100000 },
    store: MongoStore.create({
        mongoUrl: 'mongodb://127.0.0.1:27017/session',
    }) 
}))

代码

const express  = require("express");
const session = require("express-session");
const MongoStore = require('connect-mongo');
const app = express();

// 设置
app.use(session({
    secret: 'keyboard cat',// 服务端生成session的签名
    resave: false,     // 强制保存session 即使它没有变化
    saveUninitialized: true, // 强制将未初始化的session存储
    cookie: { secure: false },
    store: MongoStore.create({
        mongoUrl: 'mongodb://127.0.0.1:27017/session',
    })
  }))


app.get("/",(req,res)=>{
    // 获取session
    if(req.session.username || req.session.age){
        res.send(req.session.username+"---"+req.session.age+"登陆成功");
    }else {
        res.send("暂无登录")
    }
   
});
app.get("/login",(req,res)=>{
    // 设置session
    req.session.username = "张三",
    req.session.age = 20;

    res.send("登陆成功");
});
app.get("/logout",(req,res)=>{
    req.session.destroy(); //销毁
    res.send("注销成功");
});


app.listen(8080);

八、路由模块化

1.新建user.js 在routers目录下

const express = require("express");
const router = express.Router();

router.get("/",(req,res)=>{
    res.send("用户列表");
});
router.get("/add",(req,res)=>{
    res.send("添加用户");
});
router.get("/edit",(req,res)=>{
    res.send("修改用户");
});
module.exports = router;

2.app.js 使用

const express = require("express");
const app = express();

// 导入外部模块
const user = require("./routers/user");
//挂载
app.use("/user",user);

app.get("/",(req,res)=>{
    res.send("首页");
});

app.listen(8080);

3.访问路径

localhost:8080/     首页
localhost:8080/user     用户列表
localhost:8080/user/add     添加用户

可以进行嵌套

九、express应用生成器

通过应用生成器工具 express-generator 可以快速创建一个应用的骨架

你可以通过 npx （包含在 Node.js 8.2.0 及更高版本中）命令来运行 Express 应用程序生成器

npx express-generator
//    模板引擎为ejs  项目名为express09
express --view=ejs express09

详情可以去express官方文档查看