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 相关文章推荐
js 目录列举函数
Nov 06 Javascript
javascript中的括号()用法小结
Apr 14 Javascript
基于AngularJs + Bootstrap + AngularStrap相结合实现省市区联动代码
May 30 Javascript
jQuery双向列表选择器DIV模拟版
Nov 01 Javascript
Angular2平滑升级到Angular4的步骤详解
Mar 29 Javascript
AngularJS基于factory创建自定义服务的方法详解
May 25 Javascript
Vue组件的使用教程详解
Jan 05 Javascript
JavaScript图片处理与合成总结
Mar 04 Javascript
vue filters的使用详解
Jun 11 Javascript
微信小程序chooseImage的用法(从本地相册选择图片或使用相机拍照)
Aug 22 Javascript
Vue 页面状态保持页面间数据传输的一种方法(推荐)
Nov 01 Javascript
原生JavaScript实现五子棋游戏
Nov 09 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 cookie 登录验证示例代码
2009/03/16 PHP
php利用腾讯ip分享计划获取地理位置示例分享
2014/01/20 PHP
PHP利用超级全局变量$_GET来接收表单数据的实例
2016/11/05 PHP
php数据库的增删改查 php与javascript之间的交互
2017/08/31 PHP
基于jquery的blockui插件显示弹出层
2011/04/14 Javascript
六款帮助你实现惊艳视差滚动效果的jQuery插件
2012/09/14 Javascript
JavaScript自定义日期格式化函数详细解析
2014/01/14 Javascript
jQuery实现的多选框多级联动插件
2014/05/02 Javascript
javascript实现的固定位置悬浮窗口实例
2015/04/30 Javascript
NodeJS创建基础应用并应用模板引擎
2016/04/12 NodeJs
jQuery中的通配符选择器使用总结
2016/05/30 Javascript
项目实践一图片上传之form表单还是base64前端图片压缩(前端图片压缩)
2016/07/28 Javascript
JQuery遍历元素的后代和同胞实现方法
2016/09/18 Javascript
mvc 、bootstrap 结合分布式图简单实现分页
2016/10/10 Javascript
Jquery给当前页或者跳转后页面的导航栏添加选中后样式的实例
2016/12/08 Javascript
详解vue渲染从后台获取的json数据
2017/07/06 Javascript
Vue.js学习笔记之常用模板语法详解
2017/07/25 Javascript
JS实现合并json对象的方法
2017/10/10 Javascript
vue做网页开场视频的实例代码
2017/10/20 Javascript
JS中appendChild追加子节点无效的解决方法
2018/10/14 Javascript
详解微信小程序胶囊按钮返回|首页自定义导航栏功能
2019/06/14 Javascript
在vue中使用console.log无效的解决
2020/08/09 Javascript
Vue中使用Echarts仪表盘展示实时数据的实现
2020/11/01 Javascript
[38:42]完美世界DOTA2联赛循环赛 Matador vs Forest BO2第二场 11.05
2020/11/05 DOTA
Python实现115网盘自动下载的方法
2014/09/30 Python
python3中str(字符串)的使用教程
2017/03/23 Python
详谈Python基础之内置函数和递归
2017/06/21 Python
Python实现自动上京东抢手机
2018/02/06 Python
python 生成任意形状的凸包图代码
2020/04/16 Python
使用html5 canvas创建太空游戏的示例
2014/05/08 HTML / CSS
美国在线轮胎零售商:SimpleTire
2019/04/08 全球购物
美食节策划方案
2014/05/26 职场文书
销售团队口号大全
2014/06/06 职场文书
加强机关作风建设心得体会
2014/10/22 职场文书
HTML实现仿Windows桌面主题特效的实现
2022/06/28 HTML / CSS
在python中读取和写入CSV文件详情
2022/06/28 Python