前端程序员如何自己去写接口前言：说到接口，有基础的小伙伴都知道，接口一般都是后端小朋友去写的。本不需要我们前端去触碰

前言：

说到接口，有基础的小伙伴都知道，接口一般都是后端小朋友去写的。本不需要我们前端去触碰，但是并不代表我们前端不能写，只能说执行能力没有那么完全是吧。毕竟 " 闻道有先后，术业有专攻"嘛对不对，所以本篇文章只浅浅讲一下前端程序员是如何实现接口的。

咱们说一下写这个东西需要去准备一些什么
首先得下载一个Express
Express是什么呢？
Express是一个基于Node.js平台的web开发框架 >>>下载方式可参考我前面几篇博客有详细介绍《下载和使用“包”的详细介绍》接下来就开始正式进入文章主题了!

一、用Express写get接口

第一步：创建js文件，初始化

初始化成功会如图所示.. !文件路径不要错

第二步:下载 Express“包”

下载成功的 Express 文件会显示在node_modules里面

第三步：书写index.js文件

get无参数


const app = express()

// app.方式(url , 回调)
app.get('/get/getBooks', (req, res) => {
  const data = [
    {
      'id': 1,
      'bookName': '三体',
      'author': '刘慈欣',
      'publisher': '重庆出版社'
    },
    {
      'id': 2,
      'bookName': '时间移民',
      'author': '刘慈欣',
      'publisher': '江苏凤凰文艺出版社'
    },
    {
      'id': 3,
      'bookName': '十二个明天',
      'author': '刘慈欣、刘宇昆、尼迪·奥科拉弗',
      'publisher': '北京联合出版公司'
    }
  ]
  res.send(data)
})
app.listen(3009, () => {
  console.log('服务器启动了....');
})

get有参数
只需要在其代码中添加一行

输出在小黑窗中可查看。

若能输出结果代表取出成功。这些还远远不止还可以继续深入，可以但是没必要。能懂得这一点就已经可以了！若需往后深入可查阅相关文档。

二、用Express写post接口

1. post接口-普通键值

普通键值对参数：具体来说当请求头的content-type为x-www-form-urlencoded时，表示上传的普通简单键值对。 咱们直接紧跟get接口往下写
使用post接口首先咱们得使用中间件，中间件是什么？对于node.js来说，Express是一个第三方模块，有丰富的API支持，强大而灵活的中间件特性。
中间件是给用户提供更好的服务，可方便拆卸。
解释(提供服务)：就好比你去吃饭，就只有一个厨师，菜炒好了就给你，厨师的服务肯定是没有服务员态度好，那么是不是会影响到你的口感？如果多了一个服务员呢？专门管上菜，是不是体验会更好一点。这就验证了-->服务员好比中间件一样，是给用户提供更好的服务。
解释(方便拆卸)：就依上面例子，如果再招了一个传菜员呢？那么是不是服务员也可以不需要？答案是肯定的，这就更好验证了-->可方便拆卸。
post接口结果需要第三方软件进行查看，建议下载一个Apifox->注册账号->新建项目->新建接口

第一步：调用中间件

app.use(express.urlencoded());

第二步：post 键值对

app.post('/add', (req, res) => {
  console.log('接到的参数是', req.body);
  res.send({ message: 'ok' })
})

第三步：打开测试接口软件

进行测试--- 新建接口

注意一定要是post请求 -- 地址要和index.js中的post地址一致请求参数点击body->x-www-form-urlencoded

以上都配置完毕后保存则可以开启服务器了。

第四步：打开小黑窗-->！注意路径

启动服务器之后就进入测试软件点击运行进行发送。
发送完毕之后看下面,会显示 返回数据结构校验通过!并且下面也会多出index.js的post的返回参数

再去小黑窗查看

接收到了刚刚在测试软件中配置的请求参数,到这里一个post 键值对端口就已然完成了

2. post接口-json格式的参数

第一步: 中间件

这个中间件跟前面键值对的中间件又有不同不过是大同小异

app.use(express.json())

第二步：post-json格式参数

app.post('/add-JSON', (req, res) => {
  console.log('接收到的参数是', req.body)
  res.send({ message: 'ok' })
})

第三步:打开测试接口软件

请求参数选择body->json

注意传输的一定要是json类型的是在不行写一个字符串

第四步：开启服务器->打开小黑窗

发送完毕之后看下面,会显示 返回数据结构校验通过!并且下面也会多出index.js的post的返回参数

若小黑窗中接收到了你写的请求参数那么json格式的post接口也已然完成了

3. post接口-form-data文件上传

其他接口后续更新....

前端程序员如何自己去写接口

前言 ：