express基本操作流程

express

express基本操作流程

express作用:

搭建web服务----提供静态服务器

搭建Api服务------提供操作接口

1、进入根目录,并初始化
npm init //项目初始化
npm install express --save  //安装express

安装好之后就可以使用了,所有的功能都是使用中间件管理函数

2、应用实例

获取前端的query值并写入文件中

const express = require('express');
const fs = require('fs');
const path = require('path');
const app = express(); // 所以的功能都集中使用中间件的方式管理,所以app就是中间件的管理函数
const port = 8088;
const host = '10.31.157.49';/**

​     \* req   request    请求     出发地

​     \* res   response   响应     目的地

​     \* next  请求到响应的一个过程   路程

​     \* next  决定了请求和响应之间的连通

​     \* request 一般情况和前端有关

​     \* response 一般情况和后端有关

​     */

//  使用express 搭建 api服务

app.get('/', (req, res, next) => {
    
console.log(req.query); //使用req.query 获取前端发送的query数据
    
fs.writeFile(path.join(__dirname, 'data', 'data.json'), JSON.stringify(req.query), (err) => {
    
if (err) console.log(err);
    
console.log('文件写入成功');

})
    
res.send('请求成功');
    
});

console.log(`服务运行再http://${host}:${port}上了`);

})
3、web服务
1.前端渲染

​ 数据+前端模板生成的DOM解构 叫做前端渲染

​ 例如:ajax

<div>${data}</div>

2.后端渲染
使用express 搭建web静态服务

​ 静态服务器提供的功能:

1.将静态文件发送给用户

2.将后台文件 + 渲染模板 生成成的HTML解构 发送给前端

​ * java jsp

\* node 模板 + 后端数据

​ * 模板 html/ejs/pug/jade -> HTML解构 -> 前端

​ 上面的情况叫后端渲染

3.例:将静态文件发送给用户
const express = require('express');
const fs = require('fs');
const path = require('path');
const app = express();
const port = 8088;
const host = "localhost";

app.get('/home', (req, res, next) => {
    // 所谓的web静态服务  
    // 读取一个文件 发送给前端,读取一个页面发送给前端
    fs.readFile(path.join(__dirname, 'static', 'html', 'home.html'), 'utf8', (err, data) => {
        if (err) console.log(err);
        res.send(data);
    });
});


app.listen(port, host, () => {
    console.log(`服务已经运行在${host}:${port}上`);
})
4、API服务
使用express 搭建api服务

​ 在api服务中 每一个路由都是一个api(后端接口)

​ 书写api的方式增删改查:

​ get 查询

​ post 插入

​ delete 删除

​ put 修改

接口命名规范

    增  http://localhost:8080/shopcar/add
    删  http://localhost:8080/shopcar/delete
    改  http://localhost:8080/shopcar/update
    查  http://localhost:8080/shopcar/search
增  http://localhost:8080/shopcar   post请求
删  http://localhost:8080/shopcar   delete请求
改  http://localhost:8080/shopcar   put请求
查  http://localhost:8080/shopcar   get请求

新接口规范 restful api
同样的4种操作 对应4个不同的请求方式
接口名相同

同一页面响应不同请求

​ 在一个页面中可能需要的API可能方式不一样,可以写成单独的一个路由文件。在里面写入不同的请求方式

基础的路由模块写法:
// 在路由文件中需要引入express
const express = require('express');

//创建一个路由模块
const router = express.Router(); //得到的是一个路由对象

router.get('/users', (req, res, next) => {
    res.json({
        status: 200,
        msg: '请求成功'
    })
});

router.post('/users', (req, res, next) => {
    res.json({
        status: 200,
        msg: 'post请求成功'
    })
});

module.exports = router; //导出路由模块
进阶版写在一块
const express = require('express');
const router = express.Router();
/**
 * express的路由支持链式调用
 * 采用restful api接口规范 来暴露接口
 */
router
    .route('/shopcar')
    .get((req, res, next) => {
        res.json({
            status: 200,
            msg: '查询成功'
        })
    })
    .post((req, res, next) => {
        res.json({
            status: 200,
            msg: '数据插入成功'
        })
    })
    .delete((req, res, next) => {
        res.json({
            status: 200,
            msg: '删除成功'
        })
    }).put((req, res, next) => {
        res.json({
            status: 200,
            msg: '修改成功'
        })
    });
module.exports = router;
引入并使用路由模块

​ 自定义路由模块后引入路由模块,并使用路由模块

const express = require('express');
const app = express();
const port = 8088;
const host = 'localhost';
// 引入路由模块

const usersRouter = require('./router/users'); //相对路径 

// 所有的功能在express中 都是使用中间件的方式完成
// 使用中间件 (函数)

app.use('', usersRouter);


app.listen(port, host, () => {
    console.log('server is running');
})
	这样就可以在一个页面中,通过不同的请求方式得到不同的相应。但因为浏览器只能显示get的api,其它方式的api需要用专门的测试软件测试出来

在这里我们用的是Insomnia,新建链接,采用不同的请求方式来测试api。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值