You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
237 lines
5.8 KiB
237 lines
5.8 KiB
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<title>api调试</title>
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css">
|
|
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
|
|
<style>
|
|
.row{
|
|
margin:0px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
|
|
<div class="container" style="margin:10px;width:95%">
|
|
|
|
<div class="pull-left" style="width:70%;border-right:2px green solid">
|
|
<form role="form" action="" id="form">
|
|
|
|
<div class="row">
|
|
<div class="col-md-2">
|
|
<div class="form-group">
|
|
<select class="form-control" name="method" id="method">
|
|
<option value="POST">POST</option>
|
|
<option value="GET">GET</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="form-group">
|
|
<input type="text" class="form-control" id="url" name="url" value="http://api.hardphp.com/index.php" autocomplete="off" placeholder="根地址">
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="form-group">
|
|
<input type="text" class="form-control" id="api" name="api" autocomplete="off" placeholder="接口地址">
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div class="col-md-2">
|
|
<div class="form-group">
|
|
<button class="btn btn-success" id ="submit" type="submit" >提交数据</button>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
<h3 style="color:red">===========header参数==============</h3>
|
|
|
|
<div class="row">
|
|
<div class="col-md-2">
|
|
<h4>appid:</h4>
|
|
</div>
|
|
<div class="col-md-8">
|
|
<div class="form-group">
|
|
<input type="text" class="form-control" name="appid" value="" autocomplete="off" placeholder="x-access-appid">
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-2">
|
|
<h4>token:</h4>
|
|
</div>
|
|
<div class="col-md-8">
|
|
<div class="form-group">
|
|
<input type="text" class="form-control" name="token" value="" autocomplete="off" placeholder="x-access-token">
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<h3 style="color:red">===========系统参数==============</h3>
|
|
<div class="row">
|
|
<div class="col-md-2">
|
|
<h4>签名signature:</h4>
|
|
</div>
|
|
<div class="col-md-8">
|
|
<div class="form-group">
|
|
<input type="text" class="form-control" name="signature" autocomplete="off" placeholder="签名">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-2">
|
|
<button class="btn btn-primary addsign" type="button">生成签名</button>
|
|
</div>
|
|
</div>
|
|
|
|
<h3 style="color:red">===========应用参数==============</h3>
|
|
<div class="row">
|
|
<div class="col-md-1">
|
|
<div class="form-group">
|
|
<button class="btn btn-danger add" type="button">添加参数</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-md-5">
|
|
<div class="form-group">
|
|
<input type="text" class="form-control" name="data[key][]" autocomplete="off" placeholder="参数名">
|
|
</div>
|
|
</div>
|
|
<div class="col-md-5">
|
|
<div class="form-group">
|
|
<input type="text" class="form-control" name="data[value][]" autocomplete="off" placeholder="参数值">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-2">
|
|
<button class="btn btn-info delete" type="button">删除参数</button>
|
|
</div>
|
|
</div>
|
|
|
|
</form>
|
|
|
|
</div>
|
|
|
|
<div class="pull-right" style="width:25%">
|
|
<div class="row">
|
|
<h3 style="color:red">===请求结果===</h3>
|
|
<pre id="result"></pre>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<script type="text/javascript">
|
|
$(function () {
|
|
|
|
$("#submit").click(function(){
|
|
|
|
$('#result').html('');
|
|
|
|
var url = $('#url').val();
|
|
var api = $('#api').val();
|
|
|
|
var method = $('#method').val();
|
|
if(url == '' || api == ''){
|
|
alert('请填写接口地址');
|
|
return false;
|
|
}
|
|
|
|
$.ajax({
|
|
type:method,
|
|
url:'http://api.hardphp.com/index.php/index/test/getdata',
|
|
data:$('#form').serialize(),
|
|
dataType:'json',
|
|
success:success
|
|
|
|
});
|
|
return false;
|
|
|
|
function success(data){
|
|
|
|
$('#result').html(JSON.stringify(data, null, 4));
|
|
|
|
}
|
|
});
|
|
|
|
|
|
$('.addsign').click(function(){
|
|
|
|
$.post(
|
|
"http://api.hardphp.com/index.php/index/test/index",
|
|
$('#form').serialize(),
|
|
function(data){
|
|
if(data.status){
|
|
$('input[name="signature"]').val(data.data.sign);
|
|
}else{
|
|
alert(data.msg);
|
|
}
|
|
|
|
} ,"json");
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
$('.add').click(function(){
|
|
|
|
var html ='<div class="row">';
|
|
html +='<div class="col-md-5">';
|
|
html +='<div class="form-group">';
|
|
html +='<input type="text" class="form-control" name="data[key][]" autocomplete="off" placeholder="参数名">';
|
|
html +='</div>';
|
|
html +='</div>';
|
|
html +='<div class="col-md-5">';
|
|
html +='<div class="form-group">';
|
|
html +='<input type="text" class="form-control" name="data[value][]" autocomplete="off" placeholder="参数值">';
|
|
html +='</div>';
|
|
html +='</div>';
|
|
html +='<div class="col-md-2">';
|
|
html +='<button class="btn btn-info delete" type="button">删除参数</button>';
|
|
html +='</div>';
|
|
html +='</div>';
|
|
|
|
|
|
$('#form').append(html);
|
|
|
|
});
|
|
|
|
$('#form').on('click','.delete',function(){
|
|
|
|
$(this).closest('.row').remove();
|
|
|
|
});
|
|
|
|
|
|
|
|
});
|
|
|
|
//表单提交
|
|
$(document)
|
|
.ajaxStart(function(){
|
|
$("button:submit").addClass("btn-success").removeClass('btn-success').attr("disabled", true);
|
|
})
|
|
.ajaxStop(function(){
|
|
$("button:submit").removeClass("btn-success").addClass("btn-success").attr("disabled", false);
|
|
});
|
|
|
|
</script>
|
|
|
|
</body>
|
|
</html> |