mirror of
https://github.com/YMFE/yapi.git
synced 2024-12-27 05:30:14 +08:00
260 lines
14 KiB
HTML
260 lines
14 KiB
HTML
<!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 使用手册</title>
|
||
<link rel="stylesheet" href="source/main.css" />
|
||
|
||
|
||
|
||
<link rel="stylesheet" href="styles/theme.css" />
|
||
|
||
|
||
</head>
|
||
<body>
|
||
<div class="ydoc">
|
||
<header class="ydoc-header">
|
||
<div class="ydoc-header-area">
|
||
|
||
<a href="https://github.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="active">
|
||
|
||
<a href="usage.html">使用手册</a>
|
||
</li>
|
||
|
||
<li class="">
|
||
|
||
<a href="devops.html">内网部署</a>
|
||
</li>
|
||
|
||
<li class="">
|
||
|
||
<a href="plugin.html">插件Wiki</a>
|
||
</li>
|
||
|
||
<li class="">
|
||
|
||
<a href="qa.html">常见问题</a>
|
||
</li>
|
||
|
||
<li class="">
|
||
|
||
<a href="releases.html">版本记录</a>
|
||
</li>
|
||
|
||
<li class="">
|
||
|
||
<a href="http://yapi.demo.qunar.com/" target="_blank">demo站点</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">
|
||
|
||
<div class="ydoc-container-content ">
|
||
|
||
|
||
<div class="content-left staticsidenav" role="complementary">
|
||
<nav class="docs-sidebar hidden-print hidden-xs hidden-sm">
|
||
<ul class="nav docs-sidenav">
|
||
|
||
<!-- <li > -->
|
||
<li >
|
||
|
||
<a href="getfamiliar.html">认识 YApi</a>
|
||
</li>
|
||
|
||
<!-- <li > -->
|
||
<li >
|
||
|
||
<a href="quickstart.html">创建第一个API</a>
|
||
</li>
|
||
|
||
<!-- <li > -->
|
||
<li >
|
||
|
||
<a href="manage.html">管理分组与项目</a>
|
||
</li>
|
||
|
||
<!-- <li > -->
|
||
<li >
|
||
|
||
<a href="project.html">项目操作</a>
|
||
</li>
|
||
|
||
<!-- <li > -->
|
||
<li >
|
||
|
||
<a href="interface.html">接口操作</a>
|
||
</li>
|
||
|
||
<!-- <li > -->
|
||
<li >
|
||
|
||
<a href="mock.html">普通 Mock</a>
|
||
</li>
|
||
|
||
<!-- <li class="active" class="active" > -->
|
||
<li class="active" >
|
||
|
||
<a href="adv_mock.html">高级 Mock</a>
|
||
</li>
|
||
|
||
<ul class="nav docs-sidenav-extend" >
|
||
|
||
<li >
|
||
<a href="#Mock 期望">Mock 期望</a>
|
||
</li>
|
||
|
||
<li >
|
||
<a href="#自定义 Mock 脚本">自定义 Mock 脚本</a>
|
||
</li>
|
||
|
||
<li >
|
||
<a href="#Mock 优先级说明">Mock 优先级说明</a>
|
||
</li>
|
||
|
||
</ul>
|
||
|
||
<!-- <li > -->
|
||
<li >
|
||
|
||
<a href="case.html">使用测试集</a>
|
||
</li>
|
||
|
||
<!-- <li > -->
|
||
<li >
|
||
|
||
<a href="data.html">数据导入</a>
|
||
</li>
|
||
|
||
</ul>
|
||
</nav>
|
||
</div>
|
||
|
||
<div class="content-right markdown-body use-sidebar" role="main">
|
||
|
||
<h2 class="subject" id="Mock_期望">Mock 期望 <a class="hashlink" href="#Mock_期望">#</a></h2><p>在测试时，很多时候需要根据不同的请求参数、IP 返回不同的 HTTP Code、HTTP 头和 JSON 数据。</p>
|
||
<p>Mock 期望就是根据设置的请求过滤规则，返回期望数据。</p>
|
||
<h3 class="subject" id="使用方法">使用方法 <a class="hashlink" href="#使用方法">#</a></h3><ol>
|
||
<li>进入接口详情页，点击『高级 Mock』选项。<div class="doc-img-wrapper"><img class="doc-img-r" src="./images/usage/adv-mock-case1.png"/></div></li><li>点击『添加期望』，填写过滤规则以及期望返回数据，点击『确定』保存。<div class="doc-img-wrapper"><img class="doc-img-r" src="./images/usage/adv-mock-case3.png"/></div>
|
||
<div class="doc-img-wrapper"><img class="doc-img-r" src="./images/usage/adv-mock-case4.png"/></div></li><li>然后尝试在浏览器里发送符合规则的请求，查看返回的数据是否符合期望。<div class="doc-img-wrapper"><img class="doc-img-r" src="./images/usage/adv-mock-case5.png"/></div>
|
||
|
||
</li></ol>
|
||
<h3 class="subject" id="期望填写">期望填写 <a class="hashlink" href="#期望填写">#</a></h3><p>基本信息</p>
|
||
<ul>
|
||
<li>期望名称：给此条期望命名</li><li>IP 过滤：请求的 IP 是设置的地址才可能返回期望。默认 IP 过滤关闭，任何 IP 地址都可能返回期望。</li><li>参数过滤：请求必须包含设置的参数，并且值相等才可能返回期望。参数可以在 Body 或 Query 中。</li></ul>
|
||
<p>响应</p>
|
||
<ul>
|
||
<li>HTTP Code：期望响应的 HTTP 状态码</li><li>延时：期望响应的延迟时间</li><li>HTTP 头：期望响应带有的 HTTP 头</li><li>返回 JSON：期望返回的 JSON 数据</li></ul>
|
||
<h2 class="subject" id="自定义_Mock_脚本">自定义 Mock 脚本 <a class="hashlink" href="#自定义_Mock_脚本">#</a></h2><p>在前端开发阶段，对于某些接口，业务相对复杂，而 UI 端也需要根据接口返回的不同内容去做相应的处理。</p>
|
||
<p>YApi 提供了写 JS 脚本方式处理这一问题，可以根据用户请求的参数修改返回内容。</p>
|
||
<h3 class="subject" id="全局变量">全局变量 <a class="hashlink" href="#全局变量">#</a></h3><p>请求</p>
|
||
<ul>
|
||
<li><code>header</code> 请求的 HTTP 头</li><li><code>params</code> 请求参数，包括 Body、Query 中所有参数</li><li><code>cookie</code> 请求带的 Cookies</li></ul>
|
||
<p>响应</p>
|
||
<ul>
|
||
<li><p><code>mockJson</code>
|
||
接口定义的响应数据 Mock 模板</p>
|
||
</li><li><p><code>resHeader</code>
|
||
响应的 HTTP 头</p>
|
||
</li><li><p><code>httpCode</code>
|
||
响应的 HTTP 状态码</p>
|
||
</li><li><p><code>delay</code>
|
||
Mock 响应延时，单位为 ms</p>
|
||
</li><li><p><code>Random</code>
|
||
Mock.Random 方法，详细使用方法请查看 <a href="https://github.com/nuysoft/Mock/wiki/Mock.Random">Wiki</a></p>
|
||
</li></ul>
|
||
<h3 class="subject" id="使用方法">使用方法 <a class="hashlink" href="#使用方法">#</a></h3><ol>
|
||
<li>首先开启此功能</li><li>Mock 脚本就是用 JavaScript 对 <code>mockJson</code> 变量修改,请避免被全局变量(httpCode, resHeader, delay)的修改</li></ol>
|
||
<h3 class="subject" id="示例1,_根据请求参数重写_mockJson">示例1, 根据请求参数重写 mockJson <a class="hashlink" href="#示例1,_根据请求参数重写_mockJson">#</a></h3><pre><code>if(params.type == <span class="token number">1</span><span class="token punctuation">)</span><span class="token punctuation">{</span>
|
||
mockJson.errcode = <span class="token number">400</span><span class="token punctuation">;</span>
|
||
mockJson.errmsg = 'error<span class="token punctuation">;</span>
|
||
<span class="token punctuation">}</span>
|
||
|
||
if(header.token == 't'<span class="token punctuation">)</span><span class="token punctuation">{</span>
|
||
mockJson.errcode = <span class="token number">300</span><span class="token punctuation">;</span>
|
||
mockJson.errmsg = 'error<span class="token punctuation">;</span>
|
||
<span class="token punctuation">}</span>
|
||
|
||
if(cookie.type == 'a'<span class="token punctuation">)</span><span class="token punctuation">{</span>
|
||
mockJson.errcode = <span class="token number">500</span><span class="token punctuation">;</span>
|
||
mockJson.errmsg = 'error<span class="token punctuation">;</span>
|
||
<span class="token punctuation">}</span>
|
||
</code></pre><h3 class="subject" id="示例2,_生成高度自定义数据内容">示例2, 生成高度自定义数据内容 <a class="hashlink" href="#示例2,_生成高度自定义数据内容">#</a></h3><pre><code>var a = <span class="token punctuation">[</span><span class="token number">1</span><span class="token punctuation">,</span><span class="token number">1</span><span class="token punctuation">,</span><span class="token number">1</span><span class="token punctuation">,</span><span class="token number">1</span><span class="token punctuation">,</span><span class="token number">1</span><span class="token punctuation">,</span><span class="token number">1</span><span class="token punctuation">,</span><span class="token number">1</span><span class="token punctuation">,</span><span class="token number">1</span><span class="token punctuation">,</span><span class="token number">1</span><span class="token punctuation">,</span><span class="token number">1</span><span class="token punctuation">]</span>
|
||
|
||
mockJson = <span class="token punctuation">{</span>
|
||
errcode<span class="token operator">:</span> <span class="token number">0</span><span class="token punctuation">,</span>
|
||
email<span class="token operator">:</span> Random.email('qq.com'<span class="token punctuation">)</span><span class="token punctuation">,</span>
|
||
data<span class="token operator">:</span> a.map(function(item<span class="token punctuation">)</span><span class="token punctuation">{</span>
|
||
return Random.city(<span class="token punctuation">)</span> + '银行'
|
||
<span class="token punctuation">}</span><span class="token punctuation">)</span>
|
||
<span class="token punctuation">}</span>
|
||
</code></pre><h2 class="subject" id="Mock_优先级说明">Mock 优先级说明 <a class="hashlink" href="#Mock_优先级说明">#</a></h2><p>请求 Mock 数据时，规则匹配优先级：Mock 期望 > 自定义 Mock 脚本 > 普通 Mock。</p>
|
||
<p>如果前面匹配到 Mock 数据，后面 Mock 则不返回。</p>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<footer class="footer">
|
||
<div class="copyright">
|
||
© 2016 <a href="https://github.com/ymfe/yapi">YMFE</a> Team. Build by <a href="http://ued.qunar.com/ydoc/">ydoc</a>
|
||
</div>
|
||
</footer>
|
||
</div>
|
||
|
||
|
||
<div class="open-panel"></div>
|
||
<div class="mask"></div>
|
||
|
||
|
||
<script src="source/main.js"></script>
|
||
<script src="source/app.js"></script>
|
||
|
||
|
||
</body>
|
||
|
||
</html>
|