express搭建服务器

关注

原创 2023-02-01 11:09:18 3.3k 阅读 AI 写同款· GEO 优化 ›

【Express】用express搭建本地服务器（轻松上手）本地服务器为开发者提供了一个隔离的环境，便于测试代码、确保应用的安全性和稳定性，同时加快了开发流程。而模拟后端数据则允许前端在没有真实后端支持的情况下进行界面和功能的测试，提高了开发效率，确保了用户体验的一致性。//body-parser: Express 中间件，用于解析 HTTP 请求体中的数据，支持 JSON、URL 编码和多部分表单数据，让我们可以直接使用数据。注意：下载安装和配置node非本文重点的，所以有需要node的详细安装和下载，请自行搜索。使用的前端热门框架vue，本次案例用的vue2。阅读详情

一、express搭建服务器

1、引入express
2、使用exoress搭建服务器
3、监听端口
4、处理路由

const express = require('express');
const app = express()
app.listen(3000, () => {
    console.log('服务器已启动!!!');
})
app.get('/', (req, res) => {
    res.end('ok')
})

二、路由请求方式

express对于不同的请求方式，有不同的写法

const express = require('express');
const app = express()
app.listen(3000, () => {
    console.log('服务器已启动!!!');
})

app.get(url,(req,res) => {请求处理})
app.post(url,(req,res) => {请求处理})
app.put(url,(req,res) => {请求处理})
app.delete(url,(req,res) => {请求处理})

三、不完全路由匹配

const express = require('express');
const app = express()
app.listen(3000, () => {
    console.log('服务器已启动!!!');
})

// 1. ? 代表前面字符出现 0次或1次
// /abcd  /acd
// app.get('/ab?cd', (req, res) => {
//     res.end('ok')
// })

// 2. + 表示前面字符出现>=1次  
//  /abcd  / abbcd  / add...cd 
// app.post('/ab+cd', (req, res) => {
//     res.end('+')
// })

// 3. * 表示 b或c可以出现一次或多次
//  /abcd  /abbcd  /abbb...ccc..d
// app.get('/ab*cd', (req, res) => {
//     res.end('ok')
// })

// 4. () 表示括号内的内容为一个整体
// /abcd /abcbcd /abcbc....d 
// app.get('/a(bc)+d', (req, res) => {
//     res.end('())')
// })

// 5.地址中使用正则表达式
// app.get(/ab/, (req, res) => {
//     res.end('只要地址url中包含ab字符就ok')
// })

// 6. 地址中以/api 开头的路径都可以
// app.get(/^\/api/, (req, res) => {
//     res.end('地址中以/api 开头的路径都可以')
// })

// 7.restful 风格,新出来的一个规范,可以简写参数的拼接
// app.get('/api/:name/:age', (req, res) => {
//     console.log(req.params);
//     res.end('地址中以/api ')
// })

四、路由的多次处理

使用中间处理函数，一种是函数的写法，一种是数组的写法

const express = require('express');
const app = express();
app.listen(3000, () => {
    console.log('服务器已启动!!!');
})

// 第一种写法:
// app.get('/', (req, res, next) => {
//     req.body = {
//         name: "张三",
//         age: 30
//     }
//     next()
// }, (req, res, next) => {
//     next()
// }, (req, res) => {
//     console.log(req.body);
//     res.end('ok') // 结束响应
// })

// 第二种写法: 数组形式 将中间处理函数都放在一个数组中
app.get('/api', [(req, res, next) => { next() }, (req, res, next) => { next() }], (req, res) => {
    res.end('success')
})

五、响应的处理方式

// 1. res.end('响应内容')

// 2.res.send('响应内容') 

// 3.res.json(json格式数据)
// res.json({
//     code: 200,
//     status: 'ok',
//     data: [
//         { id: 1, name: "zhangsan" }
//     ]
// })

// 4. res.redirect('路径') 表示跳转到指定的路径去处理

// 5. res.sendFile(文件的绝对路径) 将读取的文件发送给前端

六、静态资源托管

使用静态资源托管项目文件，app.use(express.static(‘./static’))，静态资源托管只处理静态资源请求

七、路由模块化

1.创建router文件夹，里面有index.js文件和login.js文件

// index.js文件
const express = require('express')
const router = express.Router()
router.get('/', (req, res) => {
    res.send('跟请求')
})
module.exports = router

// login.js文件
const express = require('express')
const router = express.Router()
router.post('/login', (req, res) => {
    res.send('登录请求')
})
module.exports = router

2.在项目根目录下创建app.js文件

const express = require('express');
const app = express();
app.listen(3000, () => {
    console.log('服务器已启动!!!');
})
// 路由模块化拆分
app.get('/', require('./router/index'))
app.post('/login', require('./router/login'))

收录于