2017-07-31 20:23:22 +08:00
<!DOCTYPE html>
< html lang = "zh-CN" >
< head >
< meta charset = "UTF-8" >
< meta name = "viewport" content = "width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" / >
< meta name = "format-detection" content = "telephone=no,email=no" / >
< meta http-equiv = "X-UA-Compatible" content = "ie=edge, chrome=1" >
< meta name = "description" content = "description of your site" >
< meta name = "author" content = "author of the site" >
< title > YApi Mock功能< / title >
< link rel = "stylesheet" href = "source/main.css" / >
< / head >
< body >
< div class = "ydoc" >
< header class = "ydoc-header" >
< div class = "ydoc-header-area" >
< a href = "http://ued.qunar.com/ymfe/" class = "navbar-brand" > YMFE< / a >
< button class = "ydocIcon navbar-toggle" >  < / button >
< nav class = "ydoc-nav" >
< ul class = "navbar-left" >
< li class = "" >
< a href = "index.html" > 首页< / a >
< / li >
< li class = "" >
< a href = "interface.html" > 接口管理< / a >
< / li >
< li class = "active" >
< a href = "mock.html" > Mock功能< / a >
< / li >
< li class = "" >
< a href = "api.html" > < / a >
< / li >
< / ul >
< / nav >
< / div >
< / header >
<!-- <header style="height:20px"></header> -->
<!-- Docs page layout -->
< div class = "ydoc-banner-bg" >
< div class = "ydoc-banner " >
< div class = "ydoc-banner-area" >
< h1 > YApi< / h1 >
< p class = "desc " > 高效、易用、功能强大、的api管理平台， < / p >
< / div >
< / div >
< div class = "ydoc-container" >
2017-08-01 00:15:36 +08:00
< div class = "ydoc-container-content " id = "readme" >
2017-07-31 21:11:07 +08:00
2017-08-01 00:15:36 +08:00
< article class = "markdown-body" >
< h2 class = "subject" id = "Mock功能" > Mock功能 < a class = "hashlink" href = "#Mock功能" > #< / a > < / h2 > < p style = 'text-indent:2em;line-height:1.8em' > yapi的Mock功能可以根据用户的输入接口信息如协议、URL、接口名、请求头、请求参数、mock规则(< a href = "#mock" > 点击到Mock规则< / a > ） ， ， ， ， < / p >
2017-08-01 10:07:49 +08:00
< h3 class = "subject" id = "1_Mock步骤" > 1 Mock步骤 < a class = "hashlink" href = "#1_Mock步骤" > #< / a > < / h3 > < h4 class = "subject" id = "1.1_创建接口" > 1.1 创建接口 < a class = "hashlink" href = "#1.1_创建接口" > #< / a > < / h4 > < p > 通过点击页面上的" +添加接口" < / p >
2017-07-31 20:23:22 +08:00
< p > < img src = "http://note.youdao.com/yws/api/personal/file/WEB613bd4f29db038f2b41c03dcfceda2b6?method=download&shareKey=29bfc2b855f6f26ce0079baf567e54cc" width = "800" style = "margin:0px auto;display:block;" alt = "图片名称" align = center / > < / p >
2017-08-01 00:15:36 +08:00
< p > 输入协议、URL、接口名、请求头、请求参数、Mock规则（ < a href = "#mock" > 点击到Mock规则< / a > ）等信息。< / p >
< p > < img src = "http://note.youdao.com/yws/api/personal/file/WEB680a37ba304768804b23cf2cf36ed40d?method=download&shareKey=0d750695dce3a4c7abf697fa58d24c57" width = "800" style = "margin:0px auto;display:block;" alt = "图片名称" align = center / > < / p >
< p > 输入Mock规则时它会在右边同步产生一个对应的结果< / p >
< p > < img src = "http://note.youdao.com/yws/api/personal/file/WEB929dce5eed22e1b7e9a10be98ee2ab38?method=download&shareKey=5616ed1d9e09cc38f9cdbb995c892cb5" width = "800" style = "margin:0px auto;display:block;" alt = "图片名称" align = center / > < / p >
< p > 最后点击保存按钮，保存后将会在" Mock地址" 生成一个链接。< / p >
< blockquote >
2017-08-01 09:54:41 +08:00
< p > Mock地址的域名需要配置 host 指到我们的服务器 ip 地址< / p >
2017-08-01 00:15:36 +08:00
< / blockquote >
< p > < img src = "http://note.youdao.com/yws/api/personal/file/WEB525ea3dadf1f274bbe12943341ba00cb?method=download&shareKey=95dbc9cf7a7646387c55dabf64cad888" width = "800" style = "margin:0px auto;display:block;" alt = "图片名称" align = center / > < / p >
< p > 取到上面的链接在浏览器中请求就可以得到如下结果。< / p >
2017-08-01 14:08:51 +08:00
< p > < img src = "http://note.youdao.com/yws/api/personal/file/WEB1d1f7dc7b83a8cd6f576953cf45e9719?method=download&shareKey=99b4af9baac527b969543dd0a909d2a1" width = "800" style = "margin:0px auto;display:block;" alt = "图片名称" align = center / > < / p >
2017-07-31 20:23:22 +08:00
< p > < span id = "mock" > < / span > < / p >
2017-08-01 10:07:49 +08:00
< h3 class = "subject" id = "2.1_Mock语法规范" > 2.1 Mock语法规范 < a class = "hashlink" href = "#2.1_Mock语法规范" > #< / a > < / h3 > < blockquote >
2017-08-01 17:10:41 +08:00
< p > 了解更多Mock详情： < a href = "https://github.com/nuysoft/Mock/wiki/Syntax-Specification" > Mock.js 官方文档< / a > < / p >
2017-07-31 20:23:22 +08:00
< / blockquote >
< p > Mock.js 的语法规范包括两部分：< / p >
< p > < a href = "#DTD" > 1. 数据模板定义规范（ ， ） < / a > < / p >
< p > < a href = "#DPD" > 2. 数据占位符定义规范（ ， ） < / a > < / p >
< p > < span id = "DTD" > < / span > < / p >
2017-08-01 10:07:49 +08:00
< h3 class = "subject" id = "数据模板定义规范（ ， ） > 数据模板定义规范（ ， ） < a class = "hashlink" href = "#数据模板定义规范（ ， ） > #< / a > < / h3 > < p > 数据模板中的每个属性由 3 部分构成：属性名、生成规则、属性值：< / p >
2017-07-31 20:23:22 +08:00
< pre > < code > // 属性名 name （与生成规则之间用 "|< span class = "token string" > " 隔开）
// 生成规则 rule（ ）
// 属性值 value（ < / span > @占位符" 同时也指定了最终值的初始值和类型）
'name|rule'< span class = "token operator" > :< / span > value
生成规则：
'name|min-max'< span class = "token operator" > :< / span > value
'name|count'< span class = "token operator" > :< / span > value
'name|min-max.dmin-dmax'< span class = "token operator" > :< / span > value
'name|min-max.dcount'< span class = "token operator" > :< / span > value
'name|count.dmin-dmax'< span class = "token operator" > :< / span > value
'name|count.dcount'< span class = "token operator" > :< / span > value
'name|+step'< span class = "token operator" > :< / span > value
2017-08-01 17:10:41 +08:00
< / code > < / pre > < p > 下面提供了6种生成规则以及示例包括 String、Number、Boolean、Object、Array、RegExp： < / p >
2017-08-01 10:07:49 +08:00
< h4 class = "subject" id = "1._属性值是字符串_String" > 1. 属性值是字符串 String < a class = "hashlink" href = "#1._属性值是字符串_String" > #< / a > < / h4 > < pre > < code > < span class = "token number" > 1< / span > . 'name|min-max'< span class = "token operator" > :< / span > string
2017-08-01 17:10:41 +08:00
2017-07-31 20:23:22 +08:00
通过重复 string 生成一个字符串，重复次数大于等于 min，
< span class = "token number" > 2< / span > . 'name|count'< span class = "token operator" > :< / span > string
2017-08-01 17:10:41 +08:00
2017-07-31 20:23:22 +08:00
通过重复 string 生成一个字符串，重复次数等于 count。
2017-08-01 10:07:49 +08:00
< / code > < / pre > < h4 class = "subject" id = "2._属性值是数字_Number" > 2. 属性值是数字 Number < a class = "hashlink" href = "#2._属性值是数字_Number" > #< / a > < / h4 > < pre > < code > < span class = "token number" > 1< / span > . 'name|+< span class = "token number" > 1< / span > '< span class = "token operator" > :< / span > number
2017-07-31 20:23:22 +08:00
属性值自动加 < span class = "token number" > 1< / span > ，初始值为 number。
< span class = "token number" > 2< / span > . 'name|min-max'< span class = "token operator" > :< / span > number
生成一个大于等于 min、小于等于 max 的整数，属性值 number 只是用来确定类型。
< span class = "token number" > 3< / span > . 'name|min-max.dmin-dmax'< span class = "token operator" > :< / span > number
生成一个浮点数，整数部分大于等于 min、小于等于 max，
例如：
Mock.mock(< span class = "token punctuation" > {< / span >
'number1|< span class = "token number" > 1< / span > -< span class = "token number" > 100.1< / span > -< span class = "token number" > 10< / span > '< span class = "token operator" > :< / span > < span class = "token number" > 1< / span > < span class = "token punctuation" > ,< / span >
'number2|< span class = "token number" > 123.1< / span > -< span class = "token number" > 10< / span > '< span class = "token operator" > :< / span > < span class = "token number" > 1< / span > < span class = "token punctuation" > ,< / span >
'number3|< span class = "token number" > 123.3< / span > '< span class = "token operator" > :< / span > < span class = "token number" > 1< / span > < span class = "token punctuation" > ,< / span >
'number4|< span class = "token number" > 123.10< / span > '< span class = "token operator" > :< / span > < span class = "token number" > 1.123< / span >
< span class = "token punctuation" > }< / span > < span class = "token punctuation" > )< / span >
// =>
< span class = "token punctuation" > {< / span >
< span class = "token property" > "number1"< / span > < span class = "token operator" > :< / span > < span class = "token number" > 12.92< / span > < span class = "token punctuation" > ,< / span >
< span class = "token property" > "number2"< / span > < span class = "token operator" > :< / span > < span class = "token number" > 123.51< / span > < span class = "token punctuation" > ,< / span >
< span class = "token property" > "number3"< / span > < span class = "token operator" > :< / span > < span class = "token number" > 123.777< / span > < span class = "token punctuation" > ,< / span >
< span class = "token property" > "number4"< / span > < span class = "token operator" > :< / span > < span class = "token number" > 123.1231091814< / span >
< span class = "token punctuation" > }< / span >
2017-08-01 10:07:49 +08:00
< / code > < / pre > < h4 class = "subject" id = "3._属性值是布尔型_Boolean" > 3. 属性值是布尔型 Boolean < a class = "hashlink" href = "#3._属性值是布尔型_Boolean" > #< / a > < / h4 > < pre > < code > < span class = "token number" > 1< / span > . 'name|< span class = "token number" > 1< / span > '< span class = "token operator" > :< / span > boolean
2017-07-31 20:23:22 +08:00
随机生成一个布尔值，值为 < span class = "token boolean" > true< / span > 的概率是 < span class = "token number" > 1< / span > /< span class = "token number" > 2< / span > ，值为 < span class = "token boolean" > false< / span > 的概率同样是 < span class = "token number" > 1< / span > /< span class = "token number" > 2< / span > 。
< span class = "token number" > 2< / span > . 'name|min-max'< span class = "token operator" > :< / span > value
随机生成一个布尔值，值为 value 的概率是 min / (min + max< span class = "token punctuation" > )< / span > ，值为 !value 的概率是 max / (min + max< span class = "token punctuation" > )< / span > 。
2017-08-01 10:07:49 +08:00
< / code > < / pre > < h4 class = "subject" id = "4._属性值是对象_Object" > 4. 属性值是对象 Object < a class = "hashlink" href = "#4._属性值是对象_Object" > #< / a > < / h4 > < pre > < code > < span class = "token number" > 1< / span > . 'name|count'< span class = "token operator" > :< / span > object
2017-07-31 20:23:22 +08:00
从属性值 object 中随机选取 count 个属性。
< span class = "token number" > 2< / span > . 'name|min-max'< span class = "token operator" > :< / span > object
从属性值 object 中随机选取 min 到 max 个属性。
2017-08-01 10:07:49 +08:00
< / code > < / pre > < h4 class = "subject" id = "5._属性值是数组_Array" > 5. 属性值是数组 Array < a class = "hashlink" href = "#5._属性值是数组_Array" > #< / a > < / h4 > < pre > < code > < span class = "token number" > 1< / span > . 'name|< span class = "token number" > 1< / span > '< span class = "token operator" > :< / span > array
2017-07-31 20:23:22 +08:00
从属性值 array 中随机选取 < span class = "token number" > 1< / span > 个元素，作为最终值。
< span class = "token number" > 2< / span > . 'name|+< span class = "token number" > 1< / span > '< span class = "token operator" > :< / span > array
从属性值 array 中顺序选取 < span class = "token number" > 1< / span > 个元素，作为最终值。
< span class = "token number" > 3< / span > . 'name|min-max'< span class = "token operator" > :< / span > array
通过重复属性值 array 生成一个新数组，重复次数大于等于 min，
< span class = "token number" > 4< / span > . 'name|count'< span class = "token operator" > :< / span > array
通过重复属性值 array 生成一个新数组，重复次数为 count。
2017-08-01 17:10:41 +08:00
< / code > < / pre > < h4 class = "subject" id = "6.属性值是正则表达式_RegExp" > 6.属性值是正则表达式 RegExp < a class = "hashlink" href = "#6.属性值是正则表达式_RegExp" > #< / a > < / h4 > < pre > < code > < span class = "token number" > 1< / span > . 'name'< span class = "token operator" > :< / span > regexp
2017-07-31 20:23:22 +08:00
2017-08-01 17:10:41 +08:00
根据正则表达式 regexp 反向生成可以匹配它的字符串，用于生成自定义格式的字符串。
2017-07-31 20:23:22 +08:00
例如：
2017-08-01 17:10:41 +08:00
< span class = "token punctuation" > {< / span >
2017-07-31 20:23:22 +08:00
'regexp1'< span class = "token operator" > :< / span > /< span class = "token punctuation" > [< / span > a-z< span class = "token punctuation" > ]< / span > < span class = "token punctuation" > [< / span > A-Z< span class = "token punctuation" > ]< / span > < span class = "token punctuation" > [< / span > < span class = "token number" > 0< / span > -< span class = "token number" > 9< / span > < span class = "token punctuation" > ]< / span > /< span class = "token punctuation" > ,< / span >
'regexp2'< span class = "token operator" > :< / span > /\w\W\s\S\d\D/< span class = "token punctuation" > ,< / span >
'regexp3'< span class = "token operator" > :< / span > /\d< span class = "token punctuation" > {< / span > < span class = "token number" > 5< / span > < span class = "token punctuation" > ,< / span > < span class = "token number" > 10< / span > < span class = "token punctuation" > }< / span > /
2017-08-01 17:10:41 +08:00
< span class = "token punctuation" > }< / span >
2017-07-31 20:23:22 +08:00
// =>
< span class = "token punctuation" > {< / span >
< span class = "token property" > "regexp1"< / span > < span class = "token operator" > :< / span > < span class = "token string" > "pJ7"< / span > < span class = "token punctuation" > ,< / span >
< span class = "token property" > "regexp2"< / span > < span class = "token operator" > :< / span > < span class = "token string" > "F)\fp1G"< / span > < span class = "token punctuation" > ,< / span >
< span class = "token property" > "regexp3"< / span > < span class = "token operator" > :< / span > < span class = "token string" > "561659409"< / span >
< span class = "token punctuation" > }< / span >
< / code > < / pre > < p > < span id = "DPD" > < / span > < / p >
2017-08-01 17:10:41 +08:00
< h3 class = "subject" id = "数据占位符定义规范（ ， ） > 数据占位符定义规范（ ， ） < a class = "hashlink" href = "#数据占位符定义规范（ ， ） > #< / a > < / h3 > < pre > < code > 占位符 只是在属性值字符串中占个位置，并不出现在最终的属性值中。
占位符 的格式为：
@占位符
2017-07-31 20:23:22 +08:00
说明：
2017-08-01 17:10:41 +08:00
< span class = "token number" > 1< / span > . 用 @ 来标识其后的字符串是 占位符，
2017-07-31 20:23:22 +08:00
2017-08-01 17:10:41 +08:00
例如：
name< span class = "token operator" > :< / span > < span class = "token punctuation" > {< / span >
first< span class = "token operator" > :< / span > '@FIRST'< span class = "token punctuation" > ,< / span >
middle< span class = "token operator" > :< / span > '@FIRST'< span class = "token punctuation" > ,< / span >
last< span class = "token operator" > :< / span > '@LAST'< span class = "token punctuation" > ,< / span >
full< span class = "token operator" > :< / span > '@first @middle @last'
< span class = "token punctuation" > }< / span >
2017-07-31 20:23:22 +08:00
// 上面的示例可以得到如下结果：
2017-08-01 17:10:41 +08:00
< span class = "token property" > "name"< / span > < span class = "token operator" > :< / span > < span class = "token punctuation" > {< / span >
< span class = "token property" > "first"< / span > < span class = "token operator" > :< / span > < span class = "token string" > "Charles"< / span > < span class = "token punctuation" > ,< / span >
< span class = "token property" > "middle"< / span > < span class = "token operator" > :< / span > < span class = "token string" > "Brenda"< / span > < span class = "token punctuation" > ,< / span >
< span class = "token property" > "last"< / span > < span class = "token operator" > :< / span > < span class = "token string" > "Lopez"< / span > < span class = "token punctuation" > ,< / span >
< span class = "token property" > "full"< / span > < span class = "token operator" > :< / span > < span class = "token string" > "Charles Brenda Lopez"< / span >
2017-07-31 20:23:22 +08:00
< span class = "token punctuation" > }< / span >
< / code > < / pre > < h2 class = "subject" id = "未来计划推出功能" > 未来计划推出功能 < a class = "hashlink" href = "#未来计划推出功能" > #< / a > < / h2 > < ol >
< li > ， < / li > < li > 支持HTTP和RPC协议< / li > < li > 自动化测试< / li > < li > 多人协作< / li > < / ol >
2017-08-01 00:15:36 +08:00
< / article >
2017-07-31 20:23:22 +08:00
< / div >
2017-08-01 00:15:36 +08:00
2017-07-31 20:23:22 +08:00
< / div >
< / div >
< footer class = "footer" >
< div class = "copyright" >
© 2016 < a href = "http://ued.qunar.com/ymfe/" > YMFE< / a > Team. Build by < a href = "http://ued.qunar.com/ydoc/" > ydoc< / a > .
< / div >
< / footer >
< / div >
< script src = "source/main.js" > < / script >
< script src = "source/app.js" > < / script >
< script >
var lineHeight = 17.4;
var EXAMPLE_MAX_HEIGHT;
function fold() {
// 折叠code
$('.markdown-body pre').css({
"line-height": lineHeight + "px"
});
$('.markdown-body pre').map(function(i, item) {
var $item = $(item);
var foldnumber = $item.data('foldnumber');
EXAMPLE_MAX_HEIGHT = lineHeight * (foldnumber || 6);
if ($item.height() > EXAMPLE_MAX_HEIGHT) {
$item.css({
"padding-bottom": 30
});
$item.find('code').height(EXAMPLE_MAX_HEIGHT);
$item.append('< span class = "extend" > 展开更多……< / span > ');
};
});
$('.ydoc-example').delegate('.extend', 'click', function() {
var $this = $(this);
$this.removeClass('extend').addClass('fold');
$this.html('折叠代码');
2017-08-01 10:07:49 +08:00
$this.parent().children('.js-code').height('auto');
$this.parent().height('auto');
2017-07-31 20:23:22 +08:00
});
$('.ydoc-example').delegate('.fold', 'click', function() {
var $this = $(this);
var foldnumber = $this.parent().data('foldnumber');
EXAMPLE_MAX_HEIGHT = lineHeight * (foldnumber || 6);
$this.removeClass('fold').addClass('extend');
$this.parent().height(EXAMPLE_MAX_HEIGHT); // pre
2017-08-01 10:07:49 +08:00
$this.parent().children('.js-code').height(EXAMPLE_MAX_HEIGHT); // code
2017-07-31 20:23:22 +08:00
$this.html("展开更多……");
});
}
$(document).ready(fold);
< / script >
< / body >
< / html >
