• Express-01


    本节:

    ps:安装apifox测试接口的可用性

    一、安装express

    (前提是安装好nodejs,因为这个是基于nodejs的框架)

    安装 Express - Express 中文文档 | Express 中文网

    1.创建一个项目,存放项目,在项目路径输出cmd,然后输入这行代码,安装express

     npm install express --save

    ps:这个中途又遇到了奇怪的问题,说文档权限不够,我设置了完全控制也不行,重启也不行,直接换了一个盘安装文件,就解决了。

    2.安装完之后,在总项目下创建app.js文件,然后复制下面这段带代码。

    1. const express = require('express')//引入express模块
    2. const app = express()//实例化方法
    3. const port = 8080//定义端口号
    4. //req:request前端发送的请求, res:response 后端返回的内容
    5. app.get('/', (req, res) => {//这里是接口,浏览器默认是get请求方式,如果是put方法在浏览器获取不到值
    6. //请求方式还有:post ,put,delete
    7. res.send('Hello World!')//返回到页面的内容
    8. })
    9. app.listen(port, () => {//监听成功之后,执行以下内容
    10. console.log(`Example app listening on port ${port}`)
    11. })
    12. //在这个页面改任何东西都要重启项目

    3.在终端运行项目,输入: node 文件名.js   ,就可以运行到浏览器了:http://localhost:8080/

    node app.js

     二、路由的使用,这里是一些路由的写法,浏览器可以模糊或者自动识别含有这些接口的内容。

    三、中间件的处理

    中间件是连接应用软件和系统软件之间的软件。它可以当一个翻译官,比如系统传的是二进制的内容,应用软件不懂,中间件就可以编译成应用软件理解的内容;或者它还可以判断用户有没有登录,也类似一个全局的store。

    任何请求接口,都会经过中间件,中间件可以执行方法,中间件也是写在app.js文件里面和路由端口在一起的。

    中间件函数可以执行以下任务:

    • 执行任何代码。
    • 更改请求和响应对象。
    • 结束请求-响应周期。
    • 调用堆栈中的下一个中间件。

    中间件写法:

    1. //中间件,任何接口请求都会经过中间件
    2. app.use(function (req, res, next) {
    3. console.log('Time:', Date.now())
    4. next()//经过next()方法,接口才会继续执行,不然就不会执行接请求
    5. })

    路由请求方式为all的时候可以接收所有方法,路径为*的时候,可以接收所有路径,所有也可以充当中间件

    1. //代码按照顺序,执行完中间件,会继续执行这个接口
    2. //因为这个方法是可以接收所有请求的,加上路径为*,也是可以接收所有路径的
    3. //所有这个也可以充当中间件
    4. app.all('/*', function (req, res, next) {
    5. console.log('Accessing the secret section ...')
    6. next() // pass control to the next handler
    7. })

    四、允许开放跨域请求

    1. //允许开放跨域请求
    2. app.use(function (req, res, next) {
    3. //设置允许跨域的域名,*代表允许任意域名跨域
    4. res.header("Access-Control-Allow-Origin", "*");
    5. //允许的header类型
    6. res.header("Access-Control-Allow-Headers", "content-type");
    7. //跨域允许的请求方式
    8. res.header("Access-Control-Allow-Methods", "DELETE,PUT,POST,GET,OPTIONS");
    9. if (req.method == "OPTIONS") res.sendStatus(200); //我告诉你200了,让options尝试请求快速结束,
    10. else next();//继续执行
    11. });

    五、express自带的中间件

    使用express自带的中间件

    1.express.json()  解析前端发送请求的json数据

    app.use(express.json())

    2.显示图片

    1. //1.设置路径的全局变量
    2. const path = require("path")
    3. //2.添加中间件,让图片可以路径就获取到
    4. app.use(express.static(path.join(__dirname, "static")))

    这个是测试express.json() 中间件的步骤:

    (1)在app.js写一个接口 

    (2)在apifox测试接口,接口没问题 

    (3)在终端运行,输出不了内容,说明运行不成功。 

    (4)这个时在app,js,加上express自带可以解析json数据的中间件,可以解析body传过来的json格式的数据,这样就可以正常运行接口的返回的内容了。

    app.use(express.json())

     全部app.js文件代码:

    1. const express = require('express')//引入express模块
    2. const path = require("path")
    3. const app = express()//实例化方法
    4. const port = 8000//定义端口号
    5. // 中间件,任何接口请求都会经过中间件
    6. app.use(express.json())
    7. //允许开放跨域请求
    8. app.use(function (req, res, next) {
    9. //设置允许跨域的域名,*代表允许任意域名跨域
    10. res.header("Access-Control-Allow-Origin", "*");
    11. //允许的header类型
    12. res.header("Access-Control-Allow-Headers", "content-type");
    13. //跨域允许的请求方式
    14. res.header("Access-Control-Allow-Methods", "DELETE,PUT,POST,GET,OPTIONS");
    15. if (req.method == "OPTIONS") res.sendStatus(200); //我告诉你200了,让options尝试请求快速结束,
    16. else next();//经过next()方法,接口才会继续执行,不然就不会执行接请求
    17. });
    18. //代码按照顺序,执行完中间件,会继续执行这个接口
    19. //因为这个方法是可以接收所有请求的,加上路径为*,也是可以接收所有路径的
    20. //所有这个也可以充当中间件
    21. app.all('/*', function (req, res, next) {
    22. console.log('Accessing the secret section ...')
    23. next() // pass control to the next handler
    24. })
    25. //req:request前端发送的请求, res:response 后端返回的内容
    26. app.get('/', (req, res) => {//这里是接口,浏览器默认是get请求方式,如果是put方法在浏览器获取不到值
    27. //请求方式还有:post ,put,delete
    28. res.send('Hello World!')//返回到页面的内容
    29. })
    30. app.post('/test', (req, res) => {//这里是接口,浏览器默认是get请求方式,如果是put方法在浏览器获取不到值
    31. //请求方式还有:post ,put,delete
    32. console.log(req.query);//这里是在路径传数据
    33. console.log(req.body);//这里是body 传数据
    34. res.send('测试express自带的中间件')//接口正确就会,返回到页面的内容
    35. })
    36. app.listen(port, () => {//监听成功之后,执行以下内容
    37. console.log(`Example app listening on port ${port}`)
    38. })
    39. //在这个页面改任何东西都要重启项目

    六、所有的路由请求,如果都写在app.js会显得冗余,我们可以把不用的路由抽到不用的js文件中,要用的时候,才在app,js文件里面调用,增加可读性,还有减少耦合度。

    (1)创建一个router文件夹,创建一个MoreRouter.js文件(自定义名),存放不用的路由。(以后可能会把不同接口都写在不同的文件里面方便调用)

    引入
    实例化
    接口例子:接口请求post出去(req和res是按顺序的不能搞反)
    路由导出去的方式

    1. const express = require("express");//1.引入express
    2. var router = express.Router();//2.实例化路由
    3. router.post("/more1", function (req, res) {//3.写接口 req, res顺序不能乱。固定形式
    4. res.send(req.body);
    5. console.log(req.query);//这里是在路径传数据
    6. });
    7. //get请求接口
    8. router.get("/more2", (req, res) => {
    9. res.send("hello")
    10. console.log(req.query);//这里是在路径传数据
    11. })
    12. module.exports = router;//4.路由导出去

    (2)app.js文件,app.use调用路由

    1. app.use("/more", require("./router/MoreRouter"))
    2. // more是路径地址 ,请求的是创建的路由中间件文件

    (3)测试接口:localhost:8000/more/more2        (第一个more是app.js定义的调用路径,more2是路由文件里面的接口路径名)

    七、文件的上传和下载

    1.在终端,安装文件的路由中间件

    npm install multer

      2.上传:在app.js文件里面

    (1).引入multer   (2)实例化,创建一个文件夹,用来临时存放上传的文件  (3)设置允许所有接口都可以上传文件  (4)引入后面添加的路由中间件文件

    1. const multer = require("multer") //1.引入文件上传 的模块
    2. const upload = multer({ //2.当我 有文件上传的时候,临时放在这个文件夹下面
    3. dest: "./public/upload/temp",
    4. });
    5. //3.设置所有接口都允许有上传功能
    6. app.use(upload.any());
    7. app.use("/more", require("./router/MoreRouter"))
    8. // 4.more是路径地址 ,请求的是创建的路由中间件文件

    3.创建路由中间件,自定义名字后缀为js的文件,在这里存放路径上传的接口功能。

    (1)引入fs实例化路由   (2)定义一个接口文件,存放功能。  还有一些编写中间件的基本配置代码,比如引入express

    1. const express = require("express");//1.引入express)
    2. const fs = require("fs")//1、实例化一个上传的请求方式
    3. var router = express.Router();//2.实例化路由)
    4. router.post("/upload", (req, res) => { //2.编写接收到文件之后,存放的一个功能
    5. //检测是否有文件
    6. if (!req.files) {
    7. res.send({
    8. code: 400,
    9. msg: "上传文件不能为空",
    10. });
    11. return;
    12. }
    13. //保存文件
    14. let files = req.files;
    15. let ret_files = [];
    16. for (let file of files) {
    17. //获取名字后缀
    18. let file_ext = file.originalname.substring(file.originalname.lastIndexOf(".") + 1);
    19. //使用时间戳作为文件名字
    20. let file_name = new Date().getTime() + "." + file_ext;
    21. // 移动文件并且修改文件名字
    22. fs.renameSync(
    23. process.cwd() + "/public/upload/temp/" + file.filename,
    24. process.cwd() + "/public/upload/" + file_name
    25. );
    26. ret_files.push("/public/upload/" + file_name);//放在新数组
    27. }
    28. res.send({
    29. code: 200,
    30. msg: "ok",
    31. data: ret_files,//返回文件给前端
    32. });
    33. });
    34. module.exports = router;//3.路由导出去)

    上传图片一直卡在“上传文件不能为空”,浪费了很多事件,代码没有问题,主要问题是顺序问题。

    要先实例化,然后再设置引入的中间件。

     

    3、下载文件,在路由中间件添加这一段。

    (1)下载文件代码

    1. //下载文件
    2. router.get("/download", async (req, res) => {
    3. let file_name = req.query.file_name;
    4. let file_path = process.cwd() + "/public/upload/" + file_name;
    5. res.download(file_path);
    6. })

    (2)测试下载功能,在浏览器输入这个 地址和文件

    八、路由的属性

    (1)接口请求方式

     

     (2)输出路由的属性

     (3)结束路由,在接口输入:res.end();  或者  res.status(404).end();  

     (6)路由重定向:res.redirect(”要跳的路径或者页面地址“)

      (7)设置响应的http状态。

     

  • 相关阅读:
    Java语言的基础
    如何使用ZIP方式安装MySQL:简单、快速、高效的安装方法
    Java加密与解密
    微前端一:技术选型
    Vue中 使用 Scss 实现配置、切换主题
    UE5 实现fps类游戏 note2
    面试:“索引背后的数据结构是什么样的?”,五分钟带你了解“B树,B+树”
    解决前端二进制流下载的文件(例如:excel)打不开的问题
    园子的商业化努力-开篇:绝境求商
    C语言实现一个简单的点歌系统
  • 原文地址:https://blog.csdn.net/m0_59214979/article/details/126445584