5分钟教你用nodeJS手写一个mock数据服务器的方法


Posted in NodeJs onSeptember 10, 2019

对于前端开发者而言,javascript正扮演着越来越重要的地位,它不仅能为浏览器端赋能,在web服务器方面也有很大的价值(我们可以用nodeJS来写服务端代码,启动web服务器),因此本文所要描述的,便是javascript在服务端的应用。我将介绍如何使用nodeJS来搭建一个mock服务器,方便前端自定义mock数据请求,提高前端开发的主观能动性和对项目健壮性的探索。

我们将学到

  • koa基本使用
  • koa-router的基本用法
  • koa-logger的使用
  • glob支持文件遍历查寻
  • node几个核心api的使用
  • 使用nodemon做自动重启

mock服务器基本设计思路

通过目录路径和服务端api的映射关系来实现我们的api访问,比如我们访问接口/api/article/122,我们只需要在mock服务器目录的api的article目录下,创建122.json文件即可,json文件的数据可以自定义,方便前端调试。

5分钟教你用nodeJS手写一个mock数据服务器的方法

具体实现

1.搭建一个node服务

const Koa = require('koa');
const app = new Koa();
app.listen(3000)

2.注册路由 我们使用koa-router来实现后台服务的路由功能,并通过koa提供的上下文ctx将读取到的数据返回给前端:

const Koa = require('koa');
const Router = require('koa-router');
 
const app = new Koa();
const router = new Router({prefix: '/api'});
 
router.get('/name', (ctx, next) => {
  ctx.body = {
    name: 'xuxiaoxi'
  }
 });
 
app
 .use(router.routes())
 .use(router.allowedMethods());
 
app.listen(3000)

这样我们就能实现一个勉强能用的基本的后台api服务器了,当我们请求/api/name时,会返回相应的数据给前台,这一步是我们实现mock服务的关键一步,接下来我们具体来实现目录的遍历和api的自动注册。

3.自动注册api接口并返回数据 我们将在这个阶段实现api服务的自动注册,这里我们使用glob这个第三方模块来遍历目录,并通过node的fs模块读取api文件的数据并返回给前台。glob的使用很简单,感兴趣的朋友可以自行学习,这里就不做过多介绍了。具体实现如下:

const Koa = require('koa');
const Router = require('koa-router');
const glob = require("glob");
const { resolve } = require('path');
const fs = require('fs');
 
const app = new Koa();
const router = new Router({prefix: '/api'});
 
// 注册路由
glob.sync(resolve('./api', "**/*.json")).forEach((item, i) => {
  let apiJsonPath = item && item.split('/api')[1];
  let apiPath = apiJsonPath.replace('.json', '');
  
  router.get(apiPath, (ctx, next) => {
    try {
      let jsonStr = fs.readFileSync(item).toString();
      ctx.body = {
        data: JSON.parse(jsonStr),
        state: 200,
        type: 'success' // 自定义响应体
      }
    }catch(err) {
      ctx.throw('服务器错误', 500);
    }
   });
});
 
app
 .use(router.routes())
 .use(router.allowedMethods());
 
app.listen(3000);

添加控制台日志 我们使用koa-logger实现在终端打印node日志,方便调试,虽然这不是该文章的重点,但是对于想做node开发的前端从业者,还是很有必要了解的。

const logger = require('koa-logger')
app.use(logger());

这样,我们每个请求都会在终端打印出来。

路由映射文件的生成 该功能也不是本文的重点,但是会极大的方便前端开发者调试请求,因为如果api路径很长,我们需要一个个查找,但是有了这个map文件,我们只需要拷贝自动生成的路径即可。具体实现如下:

//...
const routerMap = {}; // 存放路由映射
 
// 注册路由
glob.sync(resolve('./api', "**/*.json")).forEach((item, i) => {
  // ...
  
  // 记录路由
  routerMap[apiJsonPath] = apiPath;
});
 
fs.writeFile('./routerMap.json', JSON.stringify(routerMap, null , 4), err => {
  if(!err) {
    console.log('路由地图生成成功!')
  }
});

基本目录结构

5分钟教你用nodeJS手写一个mock数据服务器的方法

完整代码

clone地址  github地址 

https://github.com/MrXujiang/openCoder/tree/master/mockServer

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

NodeJs 相关文章推荐
NodeJS框架Express的模板视图机制分析
Jul 19 NodeJs
用nodejs写的一个简单项目打包工具
May 11 NodeJs
Nodejs关于gzip/deflate压缩详解
Mar 04 NodeJs
nodejs中全局变量的实例解析
Mar 07 NodeJs
NodeJs测试框架Mocha的安装与使用
Mar 28 NodeJs
nodejs批量下载图片的实现方法
May 19 NodeJs
NodeJs中express框架的send()方法简介
Jun 20 NodeJs
NodeJS自定义模块写法(详解)
Jun 27 NodeJs
nodejs实现的连接MySQL数据库功能示例
Jan 25 NodeJs
nodejs log4js 使用详解
May 31 NodeJs
Nodejs文件上传、监听上传进度的代码
Mar 27 NodeJs
NodeJS多种创建WebSocket监听的方式(三种)
Jun 04 NodeJs
NodeJS 文件夹拷贝以及删除功能
Sep 03 #NodeJs
纯异步nodejs文件夹(目录)复制功能
Sep 03 #NodeJs
nodejs文件夹深层复制功能
Sep 03 #NodeJs
Nodejs中使用puppeteer控制浏览器中视频播放功能
Aug 26 #NodeJs
nodejs简单抓包工具使用详解
Aug 23 #NodeJs
nodejs使用node-xlsx生成excel的方法示例
Aug 22 #NodeJs
Nodejs libuv运行原理详解
Aug 21 #NodeJs
You might like
介绍几个array库的新函数 php
2006/12/29 PHP
不要轻信 PHP_SELF的安全问题
2009/09/05 PHP
谈谈关于php的优点与缺点
2013/04/11 PHP
Ajax实现对静态页面的文章访问统计功能示例
2016/10/10 PHP
浅析PHP中json_encode与json_decode的区别
2020/07/15 PHP
JavaScript中使用构造函数实现继承的代码
2010/08/12 Javascript
特殊情况下如何获取span里面的值
2014/05/20 Javascript
深入理解JavaScript系列(44):设计模式之桥接模式详解
2015/03/04 Javascript
JS实现网页每隔3秒弹出一次对话框的方法
2015/11/09 Javascript
JS数组合并push与concat区别分析
2015/12/17 Javascript
jQuery实现智能判断固定导航条或侧边栏的方法
2016/09/04 Javascript
vuejs动态组件给子组件传递数据的方法详解
2016/09/09 Javascript
jsp 网站引入外部css或者js失效问题解决
2016/10/31 Javascript
基于jQuery实现Accordion手风琴自定义插件
2020/10/13 Javascript
5种JavaScript脚本加载的方式
2017/01/16 Javascript
Vue2.0父组件与子组件之间的事件发射与接收实例代码
2017/09/19 Javascript
微信小程序顶部可滚动导航效果
2017/10/31 Javascript
AngularJS实现的简单拖拽功能示例
2018/01/02 Javascript
p5.js 毕达哥拉斯树的实现代码
2018/03/23 Javascript
深入理解JS的事件绑定、事件流模型
2018/05/13 Javascript
karma+webpack搭建vue单元测试环境的方法示例
2018/05/24 Javascript
Vue多系统切换实现方案
2018/06/05 Javascript
angular将html代码输出为内容的实例
2018/09/30 Javascript
[46:27]DOTA2上海特级锦标赛主赛事日 - 1 胜者组第一轮#2LGD VS MVP.Phx第一局
2016/03/02 DOTA
尝试使用Python多线程抓取代理服务器IP地址的示例
2015/11/09 Python
python使用Tkinter实现在线音乐播放器
2018/01/30 Python
python爬虫开发之使用Python爬虫库requests多线程抓取猫眼电影TOP100实例
2020/03/10 Python
python将dict中的unicode打印成中文实例
2020/05/11 Python
如何利用python发送邮件
2020/09/26 Python
推荐10个HTML5响应式框架
2016/02/25 HTML / CSS
使用Html5 Stream开发实时监控系统
2020/06/02 HTML / CSS
加拿大约会网站:EliteSingles.ca
2018/01/12 全球购物
新西兰网上购物,折扣店:BestDeals.co.nz
2019/03/20 全球购物
教师党的群众路线对照检查材料
2014/09/24 职场文书
明确岗位职责
2015/02/14 职场文书
幼儿园老师个人总结
2015/02/28 职场文书