http://blog.csdn.net/wxqee/article/details/50165581

NOTIFY

官网文档现在已经很简约、很强大了,建议直接点击这里: Getting Started。


今天,我们打算花几分钟时间创建一个自己用来测试的 MockUp 服务器。

因为我是前端开发,所以这里使用 Node.js 创建一个简单的迷你工程来完成!

目标

用 curl 访问 mockserver 可以获得自己想要的结果

>>> node client1.js
>>> curl http://localhost:1080/api/demo
{"name":"value"} >>> curl -X POST 'http://localhost:1080/api/demo2?test=true' -d someBody
{"name":"value"}

我喜欢上代码

直接创建一个起步目录

npm init
  • 1

用 Java 安装 mockserver(最简单)

http://www.mock-server.com/where/downloads.html

总结起来就是:

>>> wget http://search.maven.org/remotecontent?filepath=org/mock-server/mockserver-netty/3.10.1/mockserver-netty-3.10.1-jar-with-dependencies.jar -O mockserver-netty-3.10.1-jar-with-dependencies.jar

>>> java -jar mockserver-netty-3.10.1-jar-with-dependencies.jar -serverPort 1080 -proxyPort 1090

用 Node.js 安装 mockserver

安装必要的 Grunt 工具和部件

# 全局安装 Grunt 客户端
npm install -g grunt-cli # NPM 工程安装 Grunt 以及 Grunt 插件
npm install grunt --save-dev
npm install mockserver-grunt --save-dev # 创建 Gruntfile.js
参考官方文档进行配置

然后创建一个文件 Gruntfile.js 用来调度本地的 MockServer 服务

/*File: Gruntfile.js*/
module.exports = function(grunt) { grunt.initConfig({
start_mockserver: {
start: {
options: {
serverPort: 1080,
proxyPort: 1090
}
}
},
stop_mockserver: {
stop: {
}
}
}); grunt.loadNpmTasks('mockserver-grunt'); // 默认被执行的任务列表。
grunt.registerTask('default', ['start_mockserver']);
grunt.registerTask('stop', ['stop_mockserver']);
grunt.registerTask('start', ['start_mockserver']); };

现在,通过执行下边命令即可启动一个 Mock Server 了

grunt start
  • 1

创建 MockServer Client

那么,接下来创建一个客户端文件 client1.js 用来注册自己需要如何 MockUp 一个 API 接口。

首先安装依赖:

npm install mockserver-client
  • 1

然后创建文件 client1.js:

/*File: client1.js*/
var mockServer = require('mockserver-client'),
mockServerClient = mockServer.mockServerClient, // MockServer client
proxyClient = mockServer.proxyClient; // proxy client var remote = mockServerClient('localhost', 1080),
remoteProxy = proxyClient('localhost', 1090); // 使用之前清除服务器里边已经注册的 mockup 信息,因为可能会影响当前测试结果或者开发结果呢。
remote.reset(); // 简单的设置想要的response信息
// curl -X POST http://localhost:1080/api/demo
remote.mockSimpleResponse('/api/demo', { name: 'value'}, 203); // 精确的设置想要的response消息,会参考输入的情况来判断怎么跑
// curl -X POST 'http://localhost:1080/api/demo2?test=true' -d someBody
remote.mockAnyResponse({
'httpRequest': {
'method': 'POST',
'path': '/api/demo2',
'queryStringParameters': [
{
'name': 'test',
'values': [ 'true' ]
}
],
'body': {
'type': "STRING",
'value': 'someBody'
}
}, /*httpRequest*/
'httpResponse': {
'statusCode': 200,
'body': JSON.stringify({name: 'value'}),
'delay': {
'timeUnit': 'MILLISECONDS',
'value': 250
}
}, /*httpResponse*/
'times': {
'remainingTimes': 1,
'unlimited': false
}
});

好了,搞定!

使用一下试试

$ npm install

$ node client1.js

# 再在此使用我们的目标命令即可,见文章最上边

想某些请求被现网服务器调用?

也许想同时使用现网服务器的登陆功能?

>>> curl -X POST http://localhost:1080/user/login -d account=demo_user -d password=demo_password
{"status":"LOGIN_SUCCESS","token":"abcdefgxxxxxxxx"}
# 期望这个请求被配置好的现网服务器处理

配置一个新的请求,放到 client1.js 中:

/*File: client1.js*/

// 创建 bypass 请求,符合要求的请求会透传给真的服务器处理。
// curl -X POST http://localhost:1080/user/login -d account=demo_user -d password=demo_password
remote.mockAnyResponse({
httpRequest: {
method: 'POST',
path: '/user/login'
},
httpForward: {
host: '192.168.1.101',
port: 8080,
schema: "HTTP"
},
times: {
remainingTimes: 1,
unlimited: false
}
});

然后再重新注册一下 mock 消息试试:

>>> node client1.js
>>> # 执行curl命令

支持跨域

如果需要跨域的话,需要在 Reponse 消息中配置:

{ // Response 添加 headers 配置
'httpResponse': {
'headers': [
{name: 'Access-Control-Allow-Origin', values: ['*']},
{name: 'Access-Control-Allow-Methods', values: ['POST', 'GET', 'OPTIONS']}
]
}
}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8

搞定!

【前端开发】 5分钟创建 Mock Server的更多相关文章

  1. 使用前端开发工具包WijmoJS - 创建自定义DropDownTree控件(包含源代码)

    概述 最近,有客户向我们请求开发一个前端下拉控件,需求是显示了一个列表,其中包含可由用户单独选择的项目控件,该控件将在下拉列表中显示多选TreeView(树形图). 如今WijmoJS已经实现了该控件 ...

  2. Fiddler-009-AutoResponder 简单的 MOCK SERVER 应用实例

    在我们日常的测试中经常需要测试特定的响应对应的客户端展示样式是否正确无误,实现测试方法一般有如下三种: 创建新的测试数据(工作量较大) 修改已有测试数据(例如修改对应的状态码,若是最终需要测试的按钮状 ...

  3. 25个Web前端开发工程师必看的国外大牛和酷站

    逛了一周国外大牛们的博客与酷站,真是满满的钦佩.震撼.羡慕.惊喜………… Web设计是一个不断变化的领域,因此掌握最新的发展趋势及技术动向对设计师来说非常重要.无论是学习新技术,还是寻找免费资源与工具 ...

  4. 旨在脱离后端环境的前端开发套件 - IDT Server篇

    IDT,一个基于Nodejs的,旨在脱离后端环境的前端开发套件,目的就是能让前端开发完全脱离后端的环境,无论后端是什么模板引擎(主流),都能应付自如. IDT主要包括两大部分:Server + Bui ...

  5. 旨在脱离后端环境的前端开发套件 - IDT之Server篇

    IDT,一个基于Nodejs的,旨在脱离后端环境的前端开发套件,目的就是能让前端开发完全脱离后端的环境,无论后端是什么模板引擎(主流),都能应付自如. IDT主要包括两大部分:Server + Bui ...

  6. 基于gulp编写的一个简单实用的前端开发环境好了,安装完Gulp后,接下来是你大展身手的时候了,在你自己的电脑上面随便哪个地方建一个目录,打开命令行,然后进入创建好的目录里面,开始撸代码,关于生成的json文件请点击这里https://docs.npmjs.com/files/package.json,打开的速度看你的网速了注意:以下是为了演示 ,我建的一个目录结构,你自己可以根据项目需求自己建目

    自从Node.js出现以来,基于其的前端开发的工具框架也越来越多了,从Grunt到Gulp再到现在很火的WebPack,所有的这些新的东西的出现都极大的解放了我们在前端领域的开发,作为一个在前端领域里 ...

  7. 前后端分离之让前端开发脱离接口束缚(mock)

    情景:     领导:小吴啊,最近在忙什么啊?     前吴:(心想:我擦勒,难道划水被领导发现了?也不能怪我啊,后台的哥们接口还没给呢,但要是实话实说不就对不起后台哥们了吗?)           ...

  8. 1分钟搭建极简mock server

    1.无聊的背景.起源: 如今的业务系统越来越复杂庞大,各个功能直接的调用也是多如牛毛,但如果在联调的时候,恰好被调的接口正在开发,怎么办?傻傻的等么,不存在的!这时会搭建一些server来进行mock ...

  9. 使用RAP搭建前端Mock Server

    转载自:<前后端分离--构建前端Mock Server--windows部署rap>http://www.cnblogs.com/dothin/p/5361883.html mock:模拟 ...

随机推荐

  1. if else以及大于、小于、等于逻辑表达式

    大多数情况下,可以使用测试命令来对条件进行测试.比如可以比较字符串.判断文件是否存在及是否可读等,通常用"[]"来表示条件测试.注意这里的空格很重要.要确保方括号的空格. if . ...

  2. PHP高性能开发-多进程开发

    硬件多核时代的软件业以前计算能力的提升一直在摩尔定律的指引下,沿着提升CPU时钟频率这条道路前进,从初期的几十MHz到如今的几GHz.但是,进入2002年以 来,CPU提升主频的困难越来越大,因为主频 ...

  3. IaaS, PaaS和SaaS

    原文链接:http://www.leiphone.com/news/201406/iaas-paas-and-saas.html 云服务”现在已经快成了一个家喻户晓的词了.如果你不知道PaaS, Ia ...

  4. 结构型设计模式之装饰模式(Decorator)

    结构 意图 动态地给一个对象添加一些额外的职责.就增加功能来说,D e c o r a t o r 模式相比生成子类更为灵活. 适用性 在不影响其他对象的情况下,以动态.透明的方式给单个对象添加职责. ...

  5. 左侧菜单栏右侧内容(改进,有js效果)

    (如有错敬请指点,以下是我工作中遇到并且解决的问题)上一篇文章是简洁版 这是上一篇文章的改进. 上一篇文章的左侧菜单是没有子目录的. 这是效果图: 左侧菜单代码: <div class=&quo ...

  6. 天猫首页迷思之-jquery实现整个div的懒加载(1)

    懒加载是众所周知的减少网页负载,提高性能的方法,不少大型用图片用的多的网站都用到了. 于是我网上一搜,得到一插件:jquery.lazyload    网址:http://www.appelsiini ...

  7. 给object数组进行排序(排序条件是每个元素对象的属性个数)

    从汤姆大叔的博客里看到了6个基础题目:本篇是第3题 - 给object数组进行排序(排序条件是每个元素对象的属性个数) 解题关键: 1.Array.sort的用法 2.object的属性数量的统计 解 ...

  8. Python与正则表达式[0] -> re 模块的正则表达式匹配

    正则表达式 / Regular Expression 目录 正则表达式模式 re 模块简介 使用正则表达式进行匹配 正则表达式RE(Regular Expression, Regexp, Regex) ...

  9. Codeforces 1027F. Session in BSU

    题目直通车:Codeforces 1027F. Session in BSU 思路: 对第一门考试,使用前一个时间,做标记,表示该时间已经用过,并让第一个时间指向第二个时间,表示,若之后的考试时间和当 ...

  10. 线段树【p2629】 好消息,坏消息

    顾z 你没有发现两个字里的blog都不一样嘛 qwq 题目描述-->p2629 好消息,坏消息 历程 刚开始看到这个题,发现是需要维护区间和,满心欢喜敲了一通线段树,简单debug之后交上去 \ ...