yapi/static/doc/usage-创建第一个API.html
2017-09-01 15:59:53 +08:00

195 lines
9.1 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!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="http://ued.qunar.com/ymfe/" class="navbar-brand">YMFE</a>
<button class="ydocIcon navbar-toggle">&#xf020;</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="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="usage-认识 YApi.html">认识 YApi</a>
</li>
<!-- <li class="active" class="active" > -->
<li class="active" >
<a href="usage-创建第一个API.html">创建第一个API</a>
</li>
<ul class="nav docs-sidenav-extend" >
<li >
<a href="#起步">起步</a>
</li>
</ul>
<!-- <li > -->
<li >
<a href="usage-使用mock功能.html">使用mock功能</a>
</li>
</ul>
</nav>
</div>
<div class="content-right markdown-body use-sidebar" role="main">
<h2 class="subject" id="起步">起步 <a class="hashlink" href="#起步">#</a></h2><h3 class="subject" id="创建API">创建API <a class="hashlink" href="#创建API">#</a></h3><p>注册新用户或使用 QSSO 登录。</p>
<p>新用户进入 YApi 时没有任何权限,只能浏览公开项目,想要创建 API 应联系 <code>组长</code> 将你添加到某分组或某项目中。
登录之后进到项目首页,左边侧边栏显示的即分组列表。</p>
<p><img src="./images/project_group.png" width = "200" style="margin-left:170px;display:block;" alt="图片名称" align=center /></p>
<h4 class="subject" id="项目列表">项目列表 <a class="hashlink" href="#项目列表">#</a></h4><p>选中不同的分组,右边会显示该分组下的项目列表。</p>
<p><img src="./images/project_list.png" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center /></p>
<h3 class="subject" id="添加项目">添加项目 <a class="hashlink" href="#添加项目">#</a></h3><ul>
<li><p>点击右上角的“+“号进入添加项目页面
<img src="./images/project_add.png" width = "100%" style="margin:0px auto;display:block;" alt="图片名称" align=center /></p>
</li><li><p>添加项目页面
<img src="./images/project_add_view.png" width = "100%" style="margin:0px auto;display:block;" alt="图片名称" align=center />
添加完成后进去项目详情页面</p>
</li></ul>
<h3 class="subject" id="项目详情页面">项目详情页面 <a class="hashlink" href="#项目详情页面">#</a></h3><h4 class="subject" id="添加接口分类">添加接口分类 <a class="hashlink" href="#添加接口分类">#</a></h4><p><img src="./images/interface_add_cat.png" width = "800" style="margin:0px auto;display:block;" alt="图片名称" align=center /></p>
<p>添加完成后可以在左侧列表看到新添加的接口分类</p>
<h4 class="subject" id="4.2_添加接口">4.2 添加接口 <a class="hashlink" href="#4.2_添加接口">#</a></h4><p>鼠标移动到接口分类的菜单icon点击添加接口</p>
<p><img src="./images/interface_add.png" width="400" style="margin:0px auto;display:block;" alt="图片名称" align=center /></p>
<h4 class="subject" id="4.3_接口编辑">4.3 接口编辑 <a class="hashlink" href="#4.3_接口编辑">#</a></h4><p>添加完接口点击新添加的接口,跳转到接口预览页面,可看到刚才填写的信息。接口的详细信息点击编辑功能进行添加</p>
<h4 class="subject" id="4.4_测试接口">4.4 测试接口 <a class="hashlink" href="#4.4_测试接口">#</a></h4><p>点击运行tab,可进入到接口测试页面,首先安装chrome crossRequest扩展才可正常使用此功能
<img src="./images/interface_run.png" width="800" style="margin:0px auto;display:block;" alt="图片名称" align=center />
点击保存按钮可把当前测试保存到测试集,方便下次调试</p>
</div>
</div>
</div>
</div>
<footer class="footer">
<div class="copyright">
&copy; 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>
<div class="open-panel"></div>
<div class="mask"></div>
<script src="source/main.js"></script>
<script src="source/app.js"></script>
<script>
var lineHeight = 18;
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('折叠代码');
$this.parent().children('.js-code').height('auto');
$this.parent().height('auto');
});
$('.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
$this.parent().children('.js-code').height(EXAMPLE_MAX_HEIGHT); // code
$this.html("展开更多……");
});
}
$(document).ready(fold);
</script>
</body>
</html>