node+koa实现数据mock接口的方法


Posted in Javascript onSeptember 20, 2017

基于node+koa实现的mock数据接口,Koa需要v7.6.0以上node版本,低于此版本请先升级node

目录结构

node+koa实现数据mock接口的方法

// server.js
const Koa = require('koa');
const Router = require('koa-router');
const qs = require('qs');
const assert = require('assert');

const app = new Koa();
const router = new Router();

/**
 * 获取列表数据
 * @param {request} page 页数
 * @param {request} limit 每页数据条数
 * @param {response} errno 返回状态码 0 ==> 返回成功 1 ==> 有错误
 * @param {response} hasMore 是否有更多数据
 */
let listData = require('./mock/list/list.js');

router.get('/api/getlist/:page/:limit', function (ctx, next) {
  
  const page = ctx.params.page;
  const limit = ctx.params.limit;
  const maxPage = listData.length / limit;
  
  // 构造返回对象
  let res = {
    errno: 0,
    data: {
      hasMore: true,
      data: []
    }
  };

  // 如果超过最大页面数
  if ((page*1 + 1) >= maxPage) {
    res.data.hasMore = false;
  }
  res.data.data = listData.slice(page*limit, page*limit + limit);
   ctx.body = res;
});

/**
 * 获取详情数据
 * @param {request} id 商品id
 */
const detailData = require('./mock/detail/detail.js');

router.get('/api/getdetail/:id', function (ctx, next) {

  const id = ctx.params.id
  let res = {
    errno: 0,
    data: {
      data: []
    }
  }
  res.data.data = detailData;
  // todo...
  ctx.body = res;
});

/**
 * 提交评论
 * @param {request} id 用户id
 * @param {request} uid 商品id
 * @param {request} msg 评论内容
 */
router.post('/api/comment', function (ctx, next) {
  
  const params = qs.parse(ctx.req._parsedUrl.query);
  const id = params.id;
  const uid = params.uid;
  const msg = params.msg;
  if (id === undefined || uid === undefined || msg === undefined) {
    ctx.body = {
      errno: 1,
      msg: '缺少参数'
    }
  } else {
    // todo...
    ctx.body = {
      errno: 0,
      msg: '评论成功'
    }
  }
});

app
 .use(router.routes())
 .use(router.allowedMethods());
app.listen(3000);
console.log("server is running at http://localhost:3000/");

实际项目中,调用接口会遇到跨域的问题,解决的方式有多种,这里介绍如何在webpack中配置

module.exports = {
  ...

  devServer: {
    proxy: {
     // 将 `/api` 开头的 http 请求,都代理到 `localhost:3000` 上,由 koa 提供 mock 数据
     '/api': {
      target: 'http://localhost:3000',
      secure: false
     }
    }
    ...
  }
}

项目地址:https://github.com/daijingfeng/mock-server

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

Javascript 相关文章推荐
JavaScript实现动态增加文件域表单
Feb 12 Javascript
JQuery 拾色器插件发布-jquery.icolor.js
Oct 20 Javascript
JS 操作符整理[推荐收藏]
Nov 15 Javascript
JavaScript获取网页、浏览器、屏幕高度和宽度汇总
Dec 18 Javascript
JavaScript实现三阶幻方算法谜题解答
Dec 29 Javascript
Jquery左右滑动插件之实现超级炫酷动画效果附源码下载
Dec 02 Javascript
深入理解js generator数据类型
Aug 16 Javascript
微信小程序加载更多 点击查看更多
Nov 29 Javascript
React Native 通告消息竖向轮播组件的封装
Aug 25 Javascript
vue实现购物车加减
May 30 Javascript
bootstrap-closable-tab可实现关闭的tab标签页插件
Aug 09 Javascript
vue在图片上传的时候压缩图片
Nov 18 Vue.js
详解angularjs popup-table 弹出框表格指令
Sep 20 #Javascript
ES6中Array.includes()函数的用法
Sep 20 #Javascript
微信小程序视图template模板引用的实例详解
Sep 20 #Javascript
highcharts 在angular中的使用示例代码
Sep 20 #Javascript
jQuery实现可兼容IE6的滚动监听功能
Sep 20 #jQuery
Bootstrap Table快速完美搭建后台管理系统
Sep 20 #Javascript
VUE页面中加载外部HTML的示例代码
Sep 20 #Javascript
You might like
php 数组的合并、拆分、区别取值函数集
2010/02/15 PHP
PHP仿博客园 个人博客(2) 数据库增添改删
2013/07/05 PHP
PHP数组函数array_multisort()用法实例分析
2016/04/02 PHP
php输出含有“#”字符串的方法
2017/01/18 PHP
Laravel中9个不经常用的小技巧汇总
2019/04/16 PHP
php菜单/评论数据递归分级算法的实现方法
2019/08/01 PHP
jquery中动态效果小结
2010/12/16 Javascript
jquery构造器的实现代码小结
2011/05/16 Javascript
jQuery调用RESTful WCF示例代码(GET方法/POST方法)
2014/01/26 Javascript
AngularJS表单编辑提交功能实例
2015/02/13 Javascript
JavaScript中的this使用详解
2016/07/27 Javascript
jQuery实现单击按钮遮罩弹出对话框效果(2)
2017/02/20 Javascript
详解vue.js数据传递以及数据分发slot
2018/01/20 Javascript
Vue.js计算机属性computed和methods方法详解
2019/10/12 Javascript
[02:28]DOTA2英雄基础教程 狼人
2013/12/23 DOTA
Python translator使用实例
2008/09/06 Python
Python脚本实现集群检测和管理功能
2015/03/06 Python
在Django中使用Sitemap的方法讲解
2015/07/22 Python
Python3实现发送QQ邮件功能(html)
2017/12/15 Python
用python制作游戏外挂
2018/01/04 Python
学生信息管理系统python版
2018/10/17 Python
Python检查ping终端的方法
2019/01/26 Python
python实现文件批量编码转换及注意事项
2019/10/14 Python
python通过nmap扫描在线设备并尝试AAA登录(实例代码)
2019/12/30 Python
Scrapy框架基本命令与settings.py设置
2020/02/06 Python
PyTorch中Tensor的数据类型和运算的使用
2020/09/03 Python
详解Pycharm第三方库的安装及使用方法
2020/12/29 Python
如何使用amaze ui的分页样式封装一个通用的JS分页控件
2020/08/21 HTML / CSS
校长寄语大全
2014/04/09 职场文书
承诺函格式模板
2015/01/21 职场文书
2015年领班工作总结
2015/04/29 职场文书
幼儿园万圣节活动总结
2015/05/05 职场文书
php TP5框架生成二维码链接
2021/04/01 PHP
关于Python中*args和**kwargs的深入理解
2021/08/07 Python
python装饰器代码解析
2022/03/23 Python
Redis主从复制操作和配置详情
2022/09/23 Redis