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 相关文章推荐
Jquery幻灯片特效代码分享--打开页面随机选择切换方式(3)
Aug 15 Javascript
《JavaScript高级编程》学习笔记之object和array引用类型
Nov 01 Javascript
js window对象属性和方法相关资料整理
Nov 11 Javascript
纯js实现手风琴效果
Apr 17 Javascript
vueJS简单的点击显示与隐藏的效果【实现代码】
May 03 Javascript
微信小程序 icon组件详细及实例代码
Oct 25 Javascript
Vue中正确使用jQuery的方法
Oct 30 jQuery
学习Vue组件实例
Apr 28 Javascript
vue实现手机端省市区区域选择
Sep 27 Javascript
VueCli4项目配置反向代理proxy的方法步骤
May 17 Javascript
解决Vue-Router升级导致的Uncaught (in promise)问题
Aug 07 Javascript
如何在vue中使用百度地图添加自定义覆盖物(水波纹)
Nov 03 Javascript
详解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伪静态页面函数附使用方法
2008/06/20 PHP
Docker搭建自己的PHP开发环境
2018/02/24 PHP
js form 验证函数 当前比较流行的错误提示
2009/06/23 Javascript
仿jQuery的siblings效果的js代码
2011/08/09 Javascript
jquery放大镜效果超漂亮噢
2013/11/15 Javascript
z-blog SyntaxHighlighter 长代码无法换行解决办法(jquery)
2014/11/16 Javascript
node.js中的require使用详解
2014/12/15 Javascript
Javascript通过overflow控制列表闭合与展开的方法
2015/05/15 Javascript
JavaScript实现获得所有兄弟节点的方法
2015/07/23 Javascript
Node.js的Express框架使用上手指南
2016/03/12 Javascript
Javascript刷新页面的实例
2017/09/23 Javascript
详解原生JS回到顶部
2019/03/25 Javascript
如何在微信小程序中实现Mixins方案
2019/06/20 Javascript
Vue+Koa2+mongoose写一个像素绘板的实现方法
2019/09/10 Javascript
JavaScript简易计算器制作
2020/01/17 Javascript
Javascript中的奇葩知识,你知道吗?
2021/01/25 Javascript
[03:30]完美盛典趣味短片 CSGO2019年度名场面
2019/12/07 DOTA
如何搜索查找并解决Django相关的问题
2014/06/30 Python
Python中的多重装饰器
2015/04/11 Python
python中快速进行多个字符替换的方法小结
2016/12/15 Python
实例讲解Python爬取网页数据
2018/07/08 Python
Python 占位符的使用方法详解
2019/07/10 Python
python查询MySQL将数据写入Excel
2020/10/29 Python
HTML5声音录制/播放功能的实现代码
2018/05/03 HTML / CSS
前端使用canvas生成盲水印的加密解密的实现
2020/12/16 HTML / CSS
麦德龙官方海外旗舰店:德国麦德龙超市
2017/12/23 全球购物
中学生个人自我评价
2014/02/06 职场文书
公司员工活动策划方案
2014/08/20 职场文书
个人作风建设总结
2014/10/23 职场文书
车间主任岗位职责范本
2015/04/08 职场文书
红楼梦读书笔记
2015/06/25 职场文书
教师读书活动心得体会
2016/01/14 职场文书
导游词之重庆渣滓洞
2020/01/08 职场文书
用Python远程登陆服务器的步骤
2021/04/16 Python
MySQL日期时间函数知识汇总
2022/03/17 MySQL
React如何使用axios请求数据并把数据渲染到组件
2022/08/05 Javascript