有个同事将API接口一直使用的postman来调试的，没有使用大家共用的api文档来写，造成api接口堆积越来越多。于是想到用php+layui读取postman的json文件，来展示出文档供前端开发人员使用。
开始
postman导出api数据json文件使用php语言layui渲染到界面展示
一个视图文件就可以搞定了
路由：
Route::get('/postman',function(){
return view('postman');
});代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>postman json api lumeng-(2023.05.24)</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="//cdn.staticfile.org/layui/2.8.3/css/layui.css" rel="stylesheet">
</head>
<body class="layui-bg-gray">
<?php
use Illuminate\Http\Request;
$request = new Request();
$url_params = str_replace("/postman/?", "", $_SERVER['REQUEST_URI']);
parse_str($url_params, $url_params_ary);
$folder = !empty($url_params_ary['folder']) ? $url_params_ary['folder'] : 'lumeng';
$json_name = !empty($url_params_ary['json_name']) ? $url_params_ary['json_name'] : 'baidu';
$json_name_all = $json_name.'.json';
$postman_path = base_path().'/resources/views/postman/';
$json_file_path = "{$folder}/{$json_name_all}";
$json_folder_path = $postman_path.$folder;
$get_file_path = $postman_path.$json_file_path;
if(!file_exists($get_file_path))
{
exit('文件不存在:'.$get_file_path);
}
//echo $get_file_path;
$postman_api_str = file_get_contents($get_file_path);
$postman_api_ary = json_decode($postman_api_str, true);
//print_r($postman_api_ary);exit;
//所有目录
$file_lists_ary = scandir($postman_path);
$folder_name_ary = [];
foreach($file_lists_ary as $k=>$v){
if($v=="." || $v==".."){continue;}
$folder_name_ary[] = str_replace(".json", "", $v);
}
//所有json文件（该人员下的
$file_lists_ary = scandir($json_folder_path);
$json_name_ary = [];
foreach($file_lists_ary as $k=>$v){
if($v=="." || $v==".."){continue;}
$json_name_ary[] = str_replace(".json", "", $v);
}
//print_r($folder_ary);
//print_r($json_name_ary);exit;
$this_url = request()->url();
//echo $this_url;exit;
?>
<style>
.layui-card-header{background:#fafafa; margin-top: 5px; }
</style>
<ul class="layui-nav layui-bg-green" lay-bar="disabled">
<li class="layui-nav-item">
<a href="javascript:;">人员</a>
<dl class="layui-nav-child">
<?php
foreach($folder_name_ary as $f_name):?>
<dd><a href="<?php echo $this_url.'?folder='.$f_name.'&json_name=';?>"><?php echo $f_name;?></a></dd>
<?php endforeach;?>
</dl>
</li>
<?php foreach($json_name_ary as $f_name):?>
<li class="layui-nav-item"><a href="<?php echo $this_url.'?folder='.$folder.'&json_name='.$f_name;?>"><?php echo $f_name;?></a></li>
<?php endforeach;?>
</ul>
<br>
{{--左侧菜单 --}}
<div class="layui-panel" style="width: 23%; margin: 16px;float:left;">
<ul class="layui-menu" id="demo-menu">
<?php
foreach($postman_api_ary['item'] as $key1=>$item_one):
if(empty($item_one['item'])) continue;
?>
<li class="layui-menu-item-group layui-menu-item-up" lay-options="{type: 'group'}">
<div class="layui-menu-body-title">
<?php echo "{$item_one['name']}";?> <i class="layui-icon layui-icon-up"></i>
</div>
<ul>
{{--2级和3级菜单 begin--}}
<?php
foreach($item_one['item'] as $key2=>$item_two):
$item_three_list = !empty($item_two['item']) ? $item_two['item'] : [];
?>
<?php if(empty($item_three_list))://只有2级菜单
?>
<li lay-options="{id: '<?php echo $key1.'_'.$key2?>'}">
<div class="layui-menu-body-title" id="<?php echo $key1.'_'.$key2?>"><?php echo "{$item_two['name']}";?></div>
</li>
<?php else://3级菜单 ?>
<li class="layui-menu-item-group" lay-options="{type: 'group', isAllowSpread: false}">
<div class="layui-menu-body-title"><?php echo "{$item_two['name']}";?></div>
<ul>
<?php
foreach($item_three_list as $key3=>$item_three):
?>
<li lay-options="{id: '<?php echo $key1.'_'.$key2.'_'.$key3;?>'}">
<div class="layui-menu-body-title">
<?php echo "{$item_three['name']}";?></div></li>
<?php endforeach;?>
</ul>
</li>
<?php endif;?>
<?php endforeach;?>
{{--2级和3级菜单 endif--}}
</ul>
</li>
<?php endforeach;?>
<li class="layui-menu-item-divider"></li>
</ul>
</div>
{{--右侧body--}}
<?php
foreach($postman_api_ary['item'] as $key_1=>$item_one):
if(empty($item_one['item'])) continue;
foreach($item_one['item'] as $key_2=>$item_two):
if(empty($item_two['request']) && empty($item_two['item']))
{
continue;
}
$id_key = 'rightbody_'.$key_1.'_'.$key_2;
$item_three_list = !empty($item_two['item']) ? $item_two['item'] : [];
if(empty($item_three_list))://只有2级菜单
body_html($id_key, $item_two);
else://3级菜单
foreach($item_three_list as $key3=>$item_three):
body_html($id_key.'_'.$key3, $item_three);
endforeach;
endif;
?>
<?php
endforeach;?>
<?php
endforeach;?>
<?php
function body_html_param($query_ary,$query_formdata=[])
{
$html = '';
//$query_ary = !empty($item_two['request']['url']['query']) ? $item_two['request']['url']['query'] : [];
foreach($query_ary as $query_row):
$key = $value = $description = '';
if(!empty($query_row['key'])) $key= $query_row['key'];
if(!empty($query_row['value'])) $value= $query_row['value'];
if(!empty($query_row['description'])) $description= $query_row['description'];
$html .='<tr>';
$html .='<td>'.$key.'</td>';
$html .='<td>'.$value.'</td>';
$html .='<td>'.$description.'</td>';
$html .='</tr>';
endforeach;
//$query_ary = !empty($item_two['request']['body']['formdata']) ? $item_two['request']['body']['formdata'] : [];
foreach($query_formdata as $query_row):
$key = $value = $description = '';
if(!empty($query_row['key'])) $key= $query_row['key'];
if(!empty($query_row['value'])) $value= $query_row['value'];
if(!empty($query_row['description'])) $description= $query_row['description'];
$html .='<tr>';
$html .='<td>'.$key.'</td>';
$html .='<td>'.$value.'</td>';
$html .='<td>'.$description.'</td>';
$html .='</tr>';
endforeach;
return $html;
}//end function
function body_html($id_key, $item_two){
//method
$method = !empty($item_two['request']['method']) ? $item_two['request']['method'] : '';
//接口路径
$api_url = '';
if(!empty($item_two['request']['url']['raw']))
{
$api_url = $item_two['request']['url']['raw'];
}else{
if(!empty($item_two['request']['url']) && is_string($item_two['request']['url']))
{
$api_url = $item_two['request']['url'];
}
}
//response
$response = '';
if(!empty($item_two['response'])){
$response =@json_encode($item_two['response']);
}
//param
$query_ary = !empty($item_two['request']['url']['query']) ? $item_two['request']['url']['query'] : [];
$query_formdata = !empty($item_two['request']['body']['formdata']) ? $item_two['request']['body']['formdata'] : [];
$body_html_param = body_html_param($query_ary,$query_formdata);
$a = <<<EOF
<div id="{$id_key}" class="layui-body" style="width:75%; float: left;display: none;" >
<div style="padding: 15px;">
<div class="layui-card layui-panel">
<blockquote class="layui-elem-quote layui-text">
接口名称：{$item_two['name']}
</blockquote>
<div class="layui-card-header">
method：
</div>
<div class="layui-card-body">
{$method}
</div>
<div class="layui-card-header">
接口路径:
</div>
<div class="layui-card-body">
{$api_url}
</div>
<div class="layui-card-header">
请求参数：
</div>
<div class="layui-card-body">
<table class="layui-table">
<colgroup>
<col width="150">
<col width="150">
<col>
</colgroup>
<thead>
<tr>
<th>key</th>
<th>value</th>
<th>description</th>
</tr>
</thead>
<tbody>
$body_html_param
</tbody>
</table>
</div>
<div class="layui-card-header">
response：
</div>
<div class="layui-card-body">
{$response}
</div>
</div>
</div>
</div>
EOF;
echo $a;
}
?>
{{--右侧body END--}}
<script src="//cdn.staticfile.org/layui/2.8.3/layui.js"></script>
<script src="//libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script>
layui.use(function(){
var dropdown = layui.dropdown;
var layer = layui.layer;
var util = layui.util;
// 菜单点击事件
dropdown.on('click(demo-menu)', function(options){
console.log(this, options);
var body_id = "#rightbody_"+options.id;
$(".layui-body").hide();
$(body_id).show();
console.log(body_id);
// 显示 - 仅用于演示
// layer.msg(util.escape(JSON.stringify(options)));
});
});
</script>
</body>
</html>
结束
附git的下载地址：
1367
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
