一创建项目并初始化

创建一个新文件夹,在目录下运行 npm init --y 命令来生成package.json文件

npm init --y

二下载 express 包

本地安装

npm i express

三创建web服务器

//导入express
const express = require('express')
//调用express得到app
const app = express()

五启动web服务

app.listen(3000, () => {
  console.log('服务器启动成功,请在http://localhost:3000中访问....')
})

get 接口


//导入
const express = require('express')
//调用
const app = express()
app.use(express.static('public'))
//get接口 
//    req => request:本次请求 
//    res => response : 本次响应 每一次受到浏览器的请求,就会执行一次回调
app.get('/getapi', (req, res) => {  
  // 直接返回对象
  console.log('接收到的参数是', req.query)
  //结束本次请求,设置响应体:返回给用户内容
  res.send({ message: "success" })
})
//监听端口号，启动 Web 服务
app.listen(3000, () => {
  console.log('服务器启动成功,请在http://localhost:3000中访问....')
})

post 接口

post接口与get请求不同在于 :post 请求参数放在请求体里面，get的请求参数跟在url后面，post根据请求头里面的content-type 来解析参数内容。content-type主要有三种类型，分别是下面三种。

content-type的值	表示请求体的数据格式
application/x-www-form-urlencode	普通键值对象
application/json	json对象
multipart/form-data	表单、上传文件

post接口-普通键值对

//导入
const express = require('express')
//调用
const app = express()
//使用中间件
app.use(express.static('public'))
app.use(express.urlencoded () )
//post接口 普通键值对
app.post('/post', (req, res) => {
  //可以通过req.body来获取post传递的键值对
  console.log('接收到的参数是', req.body)
  //结束本次请求,设置响应体:返回给用户内容
  res.send({ message: "success" })
})
//监听端口号，启动 Web 服务
app.listen(3000, () => {
  console.log('服务器启动成功,请在http://localhost:3000中访问....')
})

post接口-JSON格式

//导入
const express = require('express')
//调用
const app = express()
app.use(express.json())
//会自动加入req.body属性，这个属性中就包含了post请求所传入的参数
//用来处理JSON格式的数据
//post接口 JSON
app.post('/postJSON', (req, res) => {
  console.log('接收到的参数是', req.body)
  //结束本次请求,设置响应体:返回给用户内容
  res.send(req.body)
})
//监听端口号，启动 Web 服务
app.listen(3000, () => {
  console.log('服务器启动成功,请在http://localhost:3000中访问....')
})

post接口-form-data文件上传

如果post涉及文件上传操作，则需要额外使用multer第三方这个包（不属于express）来获取上传的信息

Multer 是一个 node.js 中间件，用于处理multipart/form-data类型的表单数据，它主要用于上传文件

//导入
const express = require('express')
const multer = require('multer')
//调用
const app = express()
const upload = multer({ dest: 'uploads/' }) 
//上传的文件会保存在这个目录下
//uploads表示一个目录名，也可以设置成其它
//如果当前目录下没有uploads，它会自动创建uploads这个文件夹
app.use(express.static('public'))
//post接口 文件上传
app.post('/publish', upload.single('cover'), (req, res) => {
  console.log('接收到的参数是', req.body)
  //结束本次请求,设置响应体:返回给用户内容
  res.send(req.body)
})
//监听端口号，启动 Web 服务
app.listen(3000, () => {
  console.log('服务器启动成功,请在http://localhost:3000中访问....')
})

跨域

const express = require('express');
const multer = require('multer');
const app = express();
const port = process.env.PORT || 3002;

app.get('/getUserName', function (req, res, next) {
  res.setHeader('Access-Control-Allow-Origin', '*');
  res.send('张三');
});


app.listen(port, () => {
  console.log(`已经启动服务，端口号是：${port}`);
});


let path = require("path");
let fs = require("fs");
//app.use('/upload',express.static("./upload")); // 托管静态资源
//1. 设置文件存放位置
let upload = multer({ dest: 'uploads' });
app.post('/upload', upload.single('file'), (req, res) => {  // file 与前端input 的name属性一致
  res.setHeader('Access-Control-Allow-Origin', '*');
  // 2. 上传的文件信息保存在req.file属性中
  console.log(req.file);
  let oldName = req.file.path; // 上传后默认的文件名 : 15daede910f2695c1352dccbb5c3e897
  let newName = 'uploads/' + req.file.originalname;  // 指定文件路径和文件名
  // 3. 将上传后的文件重命名
  fs.renameSync(oldName, newName);
  // 4. 文件上传成功,返回上传成功后的文件路径
  res.send({
    err: null,
    url: "http://localhost:3002/" + newName // 复制URL链接直接浏览器可以访问
  });
});

首先express并没有获取post请求body的api，所有我们要想拿到前端传过来的值，需要用中间件：body-parser，直接引入：npm i body-parser -D然后在merge接口里面就能够拿到具体的参数了。

express 接口定义

一 创建项目并初始化

二 下载 express 包

三 创建web服务器

五 启动web服务