express框架
express框架相当于再http模块加上一个中间件合集。中间件的含义就相当于处理http请求的处理函数，而express相当于调用多个中间件，这么一个框架。
参考：
相关文档：
项目下载使用：
cnpm install express --save
express路由结构化
https://expressjs.com/zh-cn/guide/routing.html
express里http.createServer
const app = express()
app.use(bodyParser.json({ limit: ‘10mb’ }))
app.use(
bodyParser.urlencoded({
extended: false,
})
)
const server = http.createServer(app)
第9行代码这样写好处有：
用http封装不但可以使用express的属性和方法，而且还可以使用http的属性和方法
具体可以参考这段讨论：express里http.createServer和app.listen有什么区别？
express 常用API
use方法和中间件
- 注册中间件，返回的是函数。注意第三个参数next，如果写
next()语句则执行完该中间件，前往下一个中间件执行下一个中间件，如果不写，则执行完该中间件，就停止运行中间件。 - 中间件，如果注册了路由，则只显示路由内容，所以使用的时候，中间件的url不应该是具体路由，而是一层路由，其他的二层路由则是具体内容路由。
let express = require('express')
let app = express()
// 路由
app.get(‘/‘, function (req, res) {
res.send(‘Hello world’)
})
app.get(‘/customer’, function (req, res) {
res.send(‘customer page’)
})
// app.get(‘/admin’, function (req, res) {
// console.log(‘—————————-‘)
// res.send(‘admin page’)
// })
// 中间件
// 如果注册了路由，则只显示路由内容
app.use(‘/admin’, function (request, response, next) {
response.writeHead(200, { ‘Content-Type’: ‘text/plain’ })
response.end(‘Welcome to the admin page!\n’)
})
app.listen(3000)
console.log(‘to http://localhost:3000/')
get方法
- 注册路由，用于指定不同的访问路径所对应的回调函数。由于get方法没有next回调函数，所以按照执行顺序，当地一个get方法执行了（根据匹配成功参数路径），后续的都不会执行了
put()post()put()del()类似get()使用（delete是JavaScript保留字，所以改叫del）
对于第一个参数，也就是路径参数，有不同的匹配规则
app.get('/customer/:who', function (req, res) {
res.send('都能访问 /' + req.params.who + ' 该路径')
})
访问 http://localhost:3000/customer/fa 返回 都能访问 /fa 该路径
访问http://localhost:3000/customer/ad 返回 都能访问 /ad 该路径
不能访问http://localhost:3000/customer
如果是:who? 则成为可选路径
set方法
- 指定变量的值
// 告诉express框架模板的位置
app.set('views', path.join(__dirname, 'views'))
// 告诉express框架模板的默认后缀是什么
app.set('view engine', 'art');
response对象
response.redirect方法允许网址的重定向。
response.sendFile方法用于发送文件。
response.render方法用于渲染网页模板。
request对象
搭建HTTPS环境
上传crt和key文件
var fs = require('fs');
var options = {
key: fs.readFileSync('E:/ssl/myserver.key'),
cert: fs.readFileSync('E:/ssl/myserver.crt'),
passphrase: '1234'
};
var https = require(‘https’);
var express = require(‘express’);
var app = express();
app.get(‘/‘, function(req, res){
res.send(‘Hello World Expressjs’);
});
var server = https.createServer(options, app);
server.listen(8084);
console.log(‘Server is running on port 8084’);
express写API接口
References
response对象json方法写接口
内置json响应的方式：
/*
* @Author: wztlink1013
* @Date: 2022-01-11 11:04:38
* @LastEditTime: 2022-01-11 11:21:17
* @Description:
*/
let obj = {
1: {
id: 1234,
name: '张三',
college: '计算机科学与工程学院',
grade: 2018,
classes: 2,
age: 21,
},
2: {
id: 5678,
name: '李四',
college: '计算机科学与工程学院',
grade: 2018,
classes: 2,
age: 21,
},
}
exports.index = function (req, res) {
res.status(200).json(obj)
}
// 接口的使用
let userinfo = require('./api/userinfo.js')
app.get('/api/userinfo', userinfo.index)
js使用接口的一些方法
跨域问题的解决
解法一：手写（但是有看到网上说会有设备（iPhone6）不兼容等问题）
// 跨域设置
app.all("*", function(req, res, next) {
res.header("Access-Control-Allow-Credentials", true);
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "X-Requested-With");
res.header("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS");
res.header("Content-Type", "application/json;charset=utf-8");
next();
});
解法二：直接使用npm里面的cors包
<!--
* @Descripttion: learn axios
* @Date: 2021-12-21 09:40:36
* @LastEditTime: 2022-01-11 11:25:28
-->
<!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>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
</head>
<body>
<script>
// 配置公共的请求头
axios.defaults.baseURL = 'http://localhost:3000/'
// 配置 超时时间
axios.defaults.timeout = 2500
// 配置公共的请求头
// axios.defaults.headers.common["Authorization"] =
// "token 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"
// axios.defaults.headers.common["Accept"] = "application/vnd.github.v3+json"
// 配置公共的 post 的 Content-Type
axios.defaults.headers.post['Content-Type'] = 'application/json'
// 请求/响应 拦截器的配置
axios.interceptors.request.use(
config => {
console.log('请求拦截器: ')
config.headers.Accept = 'application/vnd.github.v3+json'
config.headers.Authorization =
'token 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'
console.log(config)
return config
},
err => {
console.log(err)
}
)
axios.interceptors.response.use(
data => {
console.log('响应拦截器: ')
console.log(data.data)
return data.data
},
err => {
console.log(err)
}
)
// 请求数据
axios.get('api/userinfo').then(data => {
console.log(data)
})
</script>
</body>
</html>
Postman 测试API工具
如果是本地写的接口，也就是localhost类的，在web postman上是不能测试的，只能下载Postman PC应用来测试。
body-parser模块
body-parser为express框架的中间件，其作用就是对post请求的请求体进行解析。
下载使用：
cnpm install body-parser
bodyParser.json( )与bodyParser.urlencoded( )
- limit参数（json）：控制请求体最大尺寸
- extended参数（urlencoded）：
extended: false：表示使用系统模块querystring来处理，也是官方推荐的
extended: true：表示使用第三方模块qs来处理
从功能性来讲，qs比querystring要更强大，所以这里可以根据项目的实际需求来考虑
详见：https://github.com/expressjs/body-parser/#extended
References
express-session模块
设置Cookie，app.use(session({secret: 'secret key'}));
当参数为secret时候，通过设置的secret字符串，来计算hash值并放在cookie中，使产生的signedCookie防篡改
还有其他的参数：
- name: 设置cookie中，保存session的字段名称，默认为connect.sid
- store: session的存储方式，默认为存放在内存中，我们可以自定义redis等
- genid: 生成一个新的session_id时，默认为使用uid2这个npm包
- rolling: 每个请求都重新设置一个cookie，默认为false
- resave: 即使session没有被修改，也保存session值，默认为true
- saveUninitialized：强制未初始化的session保存到数据库
- secret: 通过设置的secret字符串，来计算hash值并放在cookie中，使产生的signedCookie防篡改
- cookie : 设置存放sessionid的cookie的相关选项
评论区