mirror of
https://github.com/YMFE/yapi.git
synced 2024-12-15 05:10:47 +08:00
fix: 整理帮助文档
This commit is contained in:
parent
03ec0befbb
commit
14e00dcc1b
52
README.md
52
README.md
@ -2,7 +2,7 @@
|
||||
|
||||
## 平台介绍
|
||||
|
||||
YApi是高效、易用、功能强大的api管理平台,旨在为开发、产品、测试人员提供更优雅的接口管理服务。可以帮助开发者轻松创建、发布、维护、监控和保护任意规模的 API,而且yapi为用户提供了优秀的交互体验,开发人员只需利用平台提供的接口数据写入工具以及简单的点击操作就可以实现接口的创建。
|
||||
<p style='text-indent:2em;line-height:1.8em'>YApi是<strong>高效</strong>、<strong>易用</strong>、<strong>功能强大</strong>、的api管理平台,旨在为开发、产品、测试人员提供更优雅的接口管理服务。可以帮助开发者轻松创建、发布、维护、监控和保护任意规模的 API,而且yapi为用户提供了优秀的交互体验,开发人员只需利用平台提供的接口数据写入工具以及简单的点击操作就可以实现接口的创建。</p>
|
||||
|
||||
## 功能
|
||||
1. 项目接口管理
|
||||
@ -21,65 +21,77 @@ YApi是高效、易用、功能强大的api管理平台,旨在为开发、产
|
||||
### 1 接口管理架构
|
||||
平台以**项目分组** -> **项目** -> **接口**的划分进行接口组织管理。
|
||||
|
||||
![](http://upload-images.jianshu.io/upload_images/842107-305ba49a60ee1ff5.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
|
||||
<img src="http://upload-images.jianshu.io/upload_images/842107-305ba49a60ee1ff5.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center />
|
||||
|
||||
#### 1.1 项目分组
|
||||
|
||||
登录之后进到项目首页,左边侧边栏显示的即分组列表。
|
||||
|
||||
![分组列表](http://upload-images.jianshu.io/upload_images/842107-d90ca4b3242fa760.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
|
||||
<img src="http://upload-images.jianshu.io/upload_images/842107-d90ca4b3242fa760.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "200" style="margin-left:170px;display:block;" alt="图片名称" align=center />
|
||||
|
||||
管理员有权限添加或删除分组。
|
||||
![添加分组](http://upload-images.jianshu.io/upload_images/842107-a0d4d9a98003896a.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
|
||||
|
||||
<img src="http://upload-images.jianshu.io/upload_images/842107-a0d4d9a98003896a.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center />
|
||||
|
||||
> 分组名称具有唯一性
|
||||
|
||||
#### 1.2 项目
|
||||
|
||||
选中不同的分组,右边会显示该分组下的项目列表。
|
||||
|
||||
![项目列表](http://upload-images.jianshu.io/upload_images/842107-137bcae58b84715e.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
|
||||
<img src="http://upload-images.jianshu.io/upload_images/842107-137bcae58b84715e.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center />
|
||||
|
||||
创建项目需要填写项目名称,项目线上域名(添加完成后可配置项目其他环境域名),项目接口基本路径(接口路径前面相同的部分)以及项目描述。
|
||||
![创建项目](http://upload-images.jianshu.io/upload_images/842107-360a50ddb746f73d.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
|
||||
|
||||
<img src="http://upload-images.jianshu.io/upload_images/842107-360a50ddb746f73d.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center />
|
||||
|
||||
> 项目『线上域名 + 基本路径』具有唯一性
|
||||
|
||||
#### 1.3 接口
|
||||
|
||||
点击项目名称,进入该项目接口列表。
|
||||
![接口列表](http://upload-images.jianshu.io/upload_images/842107-e858005f714f4889.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
|
||||
|
||||
<img src="http://upload-images.jianshu.io/upload_images/842107-e858005f714f4889.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center />
|
||||
|
||||
点击编辑,进入接口详情页(之后接口详情页和编辑也会分开),可以编辑接口或者请求测试真实接口。
|
||||
|
||||
![接口详情](http://upload-images.jianshu.io/upload_images/842107-78c0ea839619d068.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
|
||||
<img src="http://upload-images.jianshu.io/upload_images/842107-78c0ea839619d068.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center />
|
||||
|
||||
![请求真实接口](http://upload-images.jianshu.io/upload_images/842107-2ee7171d707e91ff.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
|
||||
<img src="http://upload-images.jianshu.io/upload_images/842107-2ee7171d707e91ff.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center />
|
||||
|
||||
|
||||
#### Mock功能
|
||||
### 2 Mock功能
|
||||
|
||||
  yapi的Mock功能可以根据用户的输入接口信息如协议、URL、接口名、请求头、请求参数、mock规则生成Mock接口,这些接口会自动生成模拟数据,支持复杂的生成逻辑,创建者可以自由构造需要的数据。而且与常见的Mock方式如将Mock写在代码里和JS拦截等相比yapi的Mock在使用场景和效率和复杂度上是相差甚远的,正是由于yapi的Mock是一个第三方平台那么在 团队开发时任何人都可以权限许可下创建、修改接口信息等操作,这对于团队开发是很有好处的。
|
||||
<p style='text-indent:2em;line-height:1.8em'>yapi的Mock功能可以根据用户的输入接口信息如协议、URL、接口名、请求头、请求参数、mock规则生成Mock接口,这些接口会自动生成模拟数据,支持复杂的生成逻辑,创建者可以自由构造需要的数据。而且与常见的Mock方式如将Mock写在代码里和JS拦截等相比yapi的Mock在使用场景和效率和复杂度上是相差甚远的,正是由于yapi的Mock是一个第三方平台那么在 团队开发时任何人都可以权限许可下创建、修改接口信息等操作,这对于团队开发是很有好处的。</p>
|
||||
|
||||
#### 2.1 添加接口
|
||||
|
||||
##### 第一步:添加接口
|
||||
通过点击页面上的"+添加接口"
|
||||
|
||||
![接口添加](http://note.youdao.com/yws/api/personal/file/WEB613bd4f29db038f2b41c03dcfceda2b6?method=download&shareKey=29bfc2b855f6f26ce0079baf567e54cc)
|
||||
<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 />
|
||||
|
||||
##### 第二步:输入协议、URL、接口名、请求头、请求参数、mock规则等信息,然后点击右上角的"Mock"按钮。
|
||||
输入协议、URL、接口名、请求头、请求参数、mock规则等信息,然后点击右上角的"Mock"按钮。
|
||||
|
||||
![接口详情](http://note.youdao.com/yws/api/personal/file/WEB0759331a53e095d910cfb4024ea657d5?method=download&shareKey=a86046f0bd2353d4763a9c962d747e5b)
|
||||
<img src="http://upload-images.jianshu.io/upload_images/842107-78c0ea839619d068.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center />
|
||||
|
||||
##### 第三步:当点击"Mock"按钮之后,就会在页面下方生成一个mock结果并产生一个API接口。点击"复制"按钮即可复制,用户拿到接口后就可以发请求了。
|
||||
#### 2.2 Mock
|
||||
|
||||
![Mock结果](http://note.youdao.com/yws/api/personal/file/WEB265d4bf7cc979bda06d07639d1b84557?method=download&shareKey=64d41dea0371e38761f494d7899b3b35)
|
||||
当点击"Mock"按钮之后,就会在页面下方生成一个mock结果并产生一个API接口。点击"复制"按钮即可复制,用户拿到接口后就可以发请求了。
|
||||
|
||||
##### 第四步:当拿到复制好接口之后就可以发起一个请求了,先将请求的信息填写完善如:请求方法(post、get等)、URL、请求头、请求的数据等。然后就点击"发送",然后在"返回结果"出可以看到接口返回的数据。
|
||||
<img src="http://note.youdao.com/yws/api/personal/file/WEBf9b154cb88d21daa8206e8c4a3d76042?method=download&shareKey=1999f6c2cf197b5b6d775c312e34073d" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center />
|
||||
|
||||
![请求接口](http://note.youdao.com/yws/api/personal/file/WEB1c22d5c4062be5f10be0b1cdfae86621?method=download&shareKey=93be3a4f1fe56219b89ea2c5ba04014d)
|
||||
将请求的信息填写完善如:请求方法(post、get等)、URL、请求头、请求的数据等。然后就点击"发送",然后在"返回结果"出可以看到接口返回的数据。
|
||||
|
||||
<img src="http://upload-images.jianshu.io/upload_images/842107-2ee7171d707e91ff.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center />
|
||||
|
||||
#### 2.3 成员管理
|
||||
|
||||
你也可以通过点击"管理成员"来添加和删除项目的成员,便于团队管理。
|
||||
|
||||
![成员管理](http://note.youdao.com/yws/api/personal/file/WEB1b9defdf0cb884f46c2bd6c30ceb02fb?method=download&shareKey=218b9326659208ec564b9fff3ea8c6c3)
|
||||
<img src="http://note.youdao.com/yws/api/personal/file/WEB1b9defdf0cb884f46c2bd6c30ceb02fb?method=download&shareKey=218b9326659208ec564b9fff3ea8c6c3" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center />
|
||||
|
||||
## 未来计划推出功能
|
||||
|
||||
1. 可视化JSON编辑器,可定义JSON_Schema和mockjs
|
||||
2. 支持HTTP和RPC协议
|
||||
3. 自动化测试
|
||||
|
51
doc/build/index.html
vendored
51
doc/build/index.html
vendored
@ -10,8 +10,6 @@
|
||||
<meta name="author" content="author of the site">
|
||||
<title>yapi 首页</title>
|
||||
<link rel="stylesheet" href="source/main.css" />
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<div class="ydoc">
|
||||
@ -46,8 +44,8 @@
|
||||
<div class="ydoc-banner-bg">
|
||||
<div class="ydoc-banner ">
|
||||
<div class="ydoc-banner-area">
|
||||
<h1 >index</h1>
|
||||
<p class="desc ">首页说明文字</p>
|
||||
<h1 >Yapi</h1>
|
||||
<p class="desc ">高效、易用、功能强大、的api管理平台,旨在为开发、产品、测试人员提供更优雅的接口管理服务。</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@ -58,7 +56,8 @@
|
||||
<div class="ydoc-container-content" id="readme">
|
||||
|
||||
<article class="markdown-body">
|
||||
<h1 class="subject" id="YApi">YApi <a class="hashlink" href="#YApi">#</a></h1><h2 class="subject" id="平台介绍">平台介绍 <a class="hashlink" href="#平台介绍">#</a></h2><p>YApi是高效、易用、功能强大的api管理平台,旨在为开发、产品、测试人员提供更优雅的接口管理服务。可以帮助开发者轻松创建、发布、维护、监控和保护任意规模的 API,而且yapi为用户提供了优秀的交互体验,开发人员只需利用平台提供的接口数据写入工具以及简单的点击操作就可以实现接口的创建。</p>
|
||||
<h1 class="subject" id="YApi">YApi <a class="hashlink" href="#YApi">#</a></h1><h2 class="subject" id="平台介绍">平台介绍 <a class="hashlink" href="#平台介绍">#</a></h2><p style='text-indent:2em;line-height:1.8em'>YApi是<strong>高效</strong>、<strong>易用</strong>、<strong>功能强大</strong>、的api管理平台,旨在为开发、产品、测试人员提供更优雅的接口管理服务。可以帮助开发者轻松创建、发布、维护、监控和保护任意规模的 API,而且yapi为用户提供了优秀的交互体验,开发人员只需利用平台提供的接口数据写入工具以及简单的点击操作就可以实现接口的创建。</p>
|
||||
|
||||
<h2 class="subject" id="功能">功能 <a class="hashlink" href="#功能">#</a></h2><ol>
|
||||
<li><p>项目接口管理</p>
|
||||
<p> 提供基本的项目分组,项目管理,接口管理功能</p>
|
||||
@ -68,34 +67,38 @@
|
||||
<p> 提供基本的用户注册登录管理等功能,集成了去哪儿QSSO登录</p>
|
||||
</li></ol>
|
||||
<h2 class="subject" id="快速开始">快速开始 <a class="hashlink" href="#快速开始">#</a></h2><h3 class="subject" id="1 接口管理架构">1 接口管理架构 <a class="hashlink" href="#1 接口管理架构">#</a></h3><p>平台以<strong>项目分组</strong> -> <strong>项目</strong> -> <strong>接口</strong>的划分进行接口组织管理。</p>
|
||||
<p><img src="http://upload-images.jianshu.io/upload_images/842107-305ba49a60ee1ff5.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" alt=""></p>
|
||||
<p><img src="http://upload-images.jianshu.io/upload_images/842107-305ba49a60ee1ff5.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center /></p>
|
||||
<h4 class="subject" id="1.1 项目分组">1.1 项目分组 <a class="hashlink" href="#1.1 项目分组">#</a></h4><p>登录之后进到项目首页,左边侧边栏显示的即分组列表。</p>
|
||||
<p><img src="http://upload-images.jianshu.io/upload_images/842107-d90ca4b3242fa760.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" alt="分组列表"></p>
|
||||
<p>管理员有权限添加或删除分组。
|
||||
<img src="http://upload-images.jianshu.io/upload_images/842107-a0d4d9a98003896a.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" alt="添加分组"></p>
|
||||
<p><img src="http://upload-images.jianshu.io/upload_images/842107-d90ca4b3242fa760.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "200" style="margin-left:170px;display:block;" alt="图片名称" align=center /></p>
|
||||
<p>管理员有权限添加或删除分组。</p>
|
||||
<p><img src="http://upload-images.jianshu.io/upload_images/842107-a0d4d9a98003896a.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center /></p>
|
||||
<blockquote>
|
||||
<p>分组名称具有唯一性</p>
|
||||
</blockquote>
|
||||
<h4 class="subject" id="1.2 项目">1.2 项目 <a class="hashlink" href="#1.2 项目">#</a></h4><p>选中不同的分组,右边会显示该分组下的项目列表。</p>
|
||||
<p><img src="http://upload-images.jianshu.io/upload_images/842107-137bcae58b84715e.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" alt="项目列表"></p>
|
||||
<p>创建项目需要填写项目名称,项目线上域名(添加完成后可配置项目其他环境域名),项目接口基本路径(接口路径前面相同的部分)以及项目描述。
|
||||
<img src="http://upload-images.jianshu.io/upload_images/842107-360a50ddb746f73d.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" alt="创建项目"></p>
|
||||
<p><img src="http://upload-images.jianshu.io/upload_images/842107-137bcae58b84715e.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center /></p>
|
||||
<p>创建项目需要填写项目名称,项目线上域名(添加完成后可配置项目其他环境域名),项目接口基本路径(接口路径前面相同的部分)以及项目描述。</p>
|
||||
<p><img src="http://upload-images.jianshu.io/upload_images/842107-360a50ddb746f73d.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center /></p>
|
||||
<blockquote>
|
||||
<p>项目『线上域名 + 基本路径』具有唯一性</p>
|
||||
</blockquote>
|
||||
<h4 class="subject" id="1.3 接口">1.3 接口 <a class="hashlink" href="#1.3 接口">#</a></h4><p>点击项目名称,进入该项目接口列表。
|
||||
<img src="http://upload-images.jianshu.io/upload_images/842107-e858005f714f4889.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" alt="接口列表"></p>
|
||||
<h4 class="subject" id="1.3 接口">1.3 接口 <a class="hashlink" href="#1.3 接口">#</a></h4><p>点击项目名称,进入该项目接口列表。</p>
|
||||
<p><img src="http://upload-images.jianshu.io/upload_images/842107-e858005f714f4889.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center /></p>
|
||||
<p>点击编辑,进入接口详情页(之后接口详情页和编辑也会分开),可以编辑接口或者请求测试真实接口。</p>
|
||||
<p><img src="http://upload-images.jianshu.io/upload_images/842107-78c0ea839619d068.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" alt="接口详情"></p>
|
||||
<p><img src="http://upload-images.jianshu.io/upload_images/842107-2ee7171d707e91ff.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" alt="请求真实接口"></p>
|
||||
<h4 class="subject" id="Mock功能">Mock功能 <a class="hashlink" href="#Mock功能">#</a></h4><p>   yapi的Mock功能可以根据用户的输入接口信息如协议、URL、接口名、请求头、请求参数、mock规则生成Mock接口,这些接口会自动生成模拟数据,支持复杂的生成逻辑,创建者可以自由构造需要的数据。而且与常见的Mock方式如将Mock写在代码里和JS拦截等相比yapi的Mock在使用场景和效率和复杂度上是相差甚远的,正是由于yapi的Mock是一个第三方平台那么在 团队开发时任何人都可以权限许可下创建、修改接口信息等操作,这对于团队开发是很有好处的。</p>
|
||||
<h5 class="subject" id="第一步:添加接口">第一步:添加接口 <a class="hashlink" href="#第一步:添加接口">#</a></h5><p>通过点击页面上的"+添加接口"</p>
|
||||
<p><img src="http://note.youdao.com/yws/api/personal/file/WEB613bd4f29db038f2b41c03dcfceda2b6?method=download&shareKey=29bfc2b855f6f26ce0079baf567e54cc" alt="接口添加"></p>
|
||||
<h5 class="subject" id="第二步:输入协议、URL、接口名、请求头、请求参数、mock规则等信息,然后点击右上角的"Mock"按钮。">第二步:输入协议、URL、接口名、请求头、请求参数、mock规则等信息,然后点击右上角的"Mock"按钮。 <a class="hashlink" href="#第二步:输入协议、URL、接口名、请求头、请求参数、mock规则等信息,然后点击右上角的"Mock"按钮。">#</a></h5><p><img src="http://note.youdao.com/yws/api/personal/file/WEB0759331a53e095d910cfb4024ea657d5?method=download&shareKey=a86046f0bd2353d4763a9c962d747e5b" alt="接口详情"></p>
|
||||
<h5 class="subject" id="第三步:当点击"Mock"按钮之后,就会在页面下方生成一个mock结果并产生一个API接口。点击"复制"按钮即可复制,用户拿到接口后就可以发请求了。">第三步:当点击"Mock"按钮之后,就会在页面下方生成一个mock结果并产生一个API接口。点击"复制"按钮即可复制,用户拿到接口后就可以发请求了。 <a class="hashlink" href="#第三步:当点击"Mock"按钮之后,就会在页面下方生成一个mock结果并产生一个API接口。点击"复制"按钮即可复制,用户拿到接口后就可以发请求了。">#</a></h5><p><img src="http://note.youdao.com/yws/api/personal/file/WEB265d4bf7cc979bda06d07639d1b84557?method=download&shareKey=64d41dea0371e38761f494d7899b3b35" alt="Mock结果"></p>
|
||||
<h5 class="subject" id="第四步:当拿到复制好接口之后就可以发起一个请求了,先将请求的信息填写完善如:请求方法(post、get等)、URL、请求头、请求的数据等。然后就点击"发送",然后在"返回结果"出可以看到接口返回的数据。">第四步:当拿到复制好接口之后就可以发起一个请求了,先将请求的信息填写完善如:请求方法(post、get等)、URL、请求头、请求的数据等。然后就点击"发送",然后在"返回结果"出可以看到接口返回的数据。 <a class="hashlink" href="#第四步:当拿到复制好接口之后就可以发起一个请求了,先将请求的信息填写完善如:请求方法(post、get等)、URL、请求头、请求的数据等。然后就点击"发送",然后在"返回结果"出可以看到接口返回的数据。">#</a></h5><p><img src="http://note.youdao.com/yws/api/personal/file/WEB1c22d5c4062be5f10be0b1cdfae86621?method=download&shareKey=93be3a4f1fe56219b89ea2c5ba04014d" alt="请求接口"></p>
|
||||
<p>你也可以通过点击"管理成员"来添加和删除项目的成员,便于团队管理。</p>
|
||||
<p><img src="http://note.youdao.com/yws/api/personal/file/WEB1b9defdf0cb884f46c2bd6c30ceb02fb?method=download&shareKey=218b9326659208ec564b9fff3ea8c6c3" alt="成员管理"></p>
|
||||
<p><img src="http://upload-images.jianshu.io/upload_images/842107-78c0ea839619d068.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center /></p>
|
||||
<p><img src="http://upload-images.jianshu.io/upload_images/842107-2ee7171d707e91ff.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center /></p>
|
||||
<h3 class="subject" id="2 Mock功能">2 Mock功能 <a class="hashlink" href="#2 Mock功能">#</a></h3> <p style='text-indent:2em;line-height:1.8em'>yapi的Mock功能可以根据用户的输入接口信息如协议、URL、接口名、请求头、请求参数、mock规则生成Mock接口,这些接口会自动生成模拟数据,支持复杂的生成逻辑,创建者可以自由构造需要的数据。而且与常见的Mock方式如将Mock写在代码里和JS拦截等相比yapi的Mock在使用场景和效率和复杂度上是相差甚远的,正是由于yapi的Mock是一个第三方平台那么在 团队开发时任何人都可以权限许可下创建、修改接口信息等操作,这对于团队开发是很有好处的。</p>
|
||||
|
||||
<h4 class="subject" id="2.1 添加接口">2.1 添加接口 <a class="hashlink" href="#2.1 添加接口">#</a></h4><p>通过点击页面上的"+添加接口"</p>
|
||||
<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>
|
||||
<p> 输入协议、URL、接口名、请求头、请求参数、mock规则等信息,然后点击右上角的"Mock"按钮。</p>
|
||||
<p><img src="http://upload-images.jianshu.io/upload_images/842107-78c0ea839619d068.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center /></p>
|
||||
<h4 class="subject" id="2.2 Mock">2.2 Mock <a class="hashlink" href="#2.2 Mock">#</a></h4><p>当点击"Mock"按钮之后,就会在页面下方生成一个mock结果并产生一个API接口。点击"复制"按钮即可复制,用户拿到接口后就可以发请求了。</p>
|
||||
<p><img src="http://note.youdao.com/yws/api/personal/file/WEBf9b154cb88d21daa8206e8c4a3d76042?method=download&shareKey=1999f6c2cf197b5b6d775c312e34073d" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center /></p>
|
||||
<p>将请求的信息填写完善如:请求方法(post、get等)、URL、请求头、请求的数据等。然后就点击"发送",然后在"返回结果"出可以看到接口返回的数据。</p>
|
||||
<p><img src="http://upload-images.jianshu.io/upload_images/842107-2ee7171d707e91ff.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center /></p>
|
||||
<h4 class="subject" id="2.3 成员管理">2.3 成员管理 <a class="hashlink" href="#2.3 成员管理">#</a></h4><p>你也可以通过点击"管理成员"来添加和删除项目的成员,便于团队管理。</p>
|
||||
<p><img src="http://note.youdao.com/yws/api/personal/file/WEB1b9defdf0cb884f46c2bd6c30ceb02fb?method=download&shareKey=218b9326659208ec564b9fff3ea8c6c3" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center /></p>
|
||||
<h2 class="subject" id="未来计划推出功能">未来计划推出功能 <a class="hashlink" href="#未来计划推出功能">#</a></h2><ol>
|
||||
<li>可视化JSON编辑器,可定义JSON_Schema和mockjs</li><li>支持HTTP和RPC协议</li><li>自动化测试</li><li>多人协作</li></ol>
|
||||
|
||||
|
54
doc/build/source/app.js
vendored
54
doc/build/source/app.js
vendored
@ -132,6 +132,23 @@ $(document).ready(function() {
|
||||
$(item).addClass('ydoc-example');
|
||||
});
|
||||
|
||||
// $('code').each(function(i, block) {
|
||||
// if (block.innerHTML.indexOf('\n') != -1) {
|
||||
// var pn = block.parentNode;
|
||||
// if (pn.tagName.toUpperCase() == 'PRE') {
|
||||
// try {
|
||||
// hljs.highlightBlock(block);
|
||||
// } catch(e) {}
|
||||
// } else {
|
||||
// pn.innerHTML = '<pre><code>' + block.innerHTML + '</code></pre>';
|
||||
// try {
|
||||
// hljs.highlightBlock(pn.childNodes[0].childNodes[0]);
|
||||
// } catch(e) {}
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
|
||||
|
||||
var winHeight = $(window).height() - 44,
|
||||
sidebar = $('.docs-sidebar');
|
||||
var docSideNav = $('.docs-sidenav');
|
||||
@ -188,9 +205,46 @@ $(document).ready(function() {
|
||||
|
||||
// 退出全屏浏览器窗口大小改变,不触发resize
|
||||
$(window).on('resize', function(e) {
|
||||
resizeSidebar();
|
||||
$contentLeftWidth = $contentLeft.width() - 1;
|
||||
});
|
||||
|
||||
function resizeSidebar() {
|
||||
var winHeight = $(window).height() - 44,
|
||||
sidebar = $('.docs-sidebar');
|
||||
var docSideNav = $('.docs-sidenav');
|
||||
if (winWidth > 767) {
|
||||
docSideNav.width($contentLeftWidth);
|
||||
}
|
||||
if (sidebar.height() > winHeight) {
|
||||
sidebar.css('max-height', winHeight + 'px');
|
||||
$('.docs-sidenav').css('max-height', winHeight + 'px');
|
||||
$('.docs-sidenav').css({
|
||||
'overflow-y': 'scroll',
|
||||
'overflow-x': 'hidden'
|
||||
});
|
||||
var barScroll = false;
|
||||
|
||||
sidebar.on('mouseover', function() {
|
||||
barScroll = true;
|
||||
});
|
||||
|
||||
sidebar.on('mouseout', function() {
|
||||
barScroll = false;
|
||||
});
|
||||
// scroll
|
||||
if ($(window).scrollTop() > ($('.footer').offset().top - $(window).height())) {
|
||||
winHeight = $(window).height() - $('.footer').outerHeight() - 44;
|
||||
sidebar.css('max-height', winHeight + 'px');
|
||||
$('.docs-sidenav').css('max-height', winHeight + 'px');
|
||||
} else {
|
||||
winHeight = $(window).height() - 44;
|
||||
sidebar.css('max-height', winHeight + 'px');
|
||||
$('.docs-sidenav').css('max-height', winHeight + 'px');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function sortAsOffset(propertyName) {
|
||||
return function(obj1, obj2) {
|
||||
var val1 = obj1[propertyName];
|
||||
|
2
doc/build/source/code.css
vendored
2
doc/build/source/code.css
vendored
File diff suppressed because one or more lines are too long
2
doc/build/source/main.css
vendored
2
doc/build/source/main.css
vendored
File diff suppressed because one or more lines are too long
@ -18,8 +18,8 @@
|
||||
"name": "index", // Page Name 会根据他生成 html 文件,例: index.html
|
||||
"title": "首页", // Page Title
|
||||
"banner": { // Banner 配置
|
||||
"title": "index",
|
||||
"description": "首页说明文字"
|
||||
"title": "Yapi",
|
||||
"description": "高效、易用、功能强大、的api管理平台,旨在为开发、产品、测试人员提供更优雅的接口管理服务。"
|
||||
},
|
||||
"content": "./README.md" // 内容(这里以markdown文件举例)
|
||||
},{
|
||||
|
Loading…
Reference in New Issue
Block a user