mirror of
https://github.com/alibaba/anyproxy.git
synced 2025-04-21 18:54:21 +00:00
368 lines
8.0 KiB
HTML
368 lines
8.0 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Anyproxy</title>
|
|
<link rel="stylesheet" href="/css/uikit.min.css" />
|
|
</head>
|
|
<body>
|
|
<div class="topHead">
|
|
<h1>Anyproxy</h1>
|
|
</div>
|
|
|
|
<table class="mainRecordTable uk-table uk-table-striped uk-table-condensed uk-table-hover">
|
|
<thead>
|
|
<tr>
|
|
<th>id</th>
|
|
<th>host</th>
|
|
<th>path</th>
|
|
<th>code</th>
|
|
<th>mime type</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>www.baidu.com</td>
|
|
<td>/search?a=b</td>
|
|
<td>200</td>
|
|
<td>text/html</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
<div class="recordDetailOverlay">
|
|
<section class="req">
|
|
<h4 class="subTitle">request</h4>
|
|
<div class="detail">
|
|
<ul class="uk-list">
|
|
<li>GET www.baidu.com</li>
|
|
<li>/search?q=123&callbac=123</li>
|
|
<li><strong>Content-Type</strong> : text/html</li>
|
|
<li><strong>x-powered</strong> : text/html</li>
|
|
<li><strong>access-control-allow-credencial</strong> : true</li>
|
|
</ul>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="resHeader">
|
|
<h4 class="subTitle">response header</h4>
|
|
<div class="detail">
|
|
<ul class="uk-list">
|
|
<li>HTTP/1.1 200</li>
|
|
<li><strong>Content-Type</strong> : text/html</li>
|
|
<li><strong>x-powered</strong> : text/html</li>
|
|
<li><strong>access-control-allow-credencial</strong> : true</li>
|
|
<li><strong>Content-Type</strong> : text/html</li>
|
|
<li><strong>x-powered</strong> : text/html</li>
|
|
<li><strong>access-control-allow-credencial</strong> : true</li>
|
|
<li><strong>Content-Type</strong> : text/html</li>
|
|
</ul>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="resBody">
|
|
<h4 class="subTitle">response body</h4>
|
|
<div class="detail">
|
|
<form class="uk-form">
|
|
<textarea>NOTE In this example we used a button from the Button component. To add a top margin to form elements, when they stack on smaller viewports, just add the data-uk-margin attribute from the Utility component to the parent element.NOTE In this example we used a button from the Button component. To add a top margin to form elements, when they stack on smaller viewports, just add the data-uk-margin attribute from the Utility component to the parent element. NOTE In this example we used a button from the Button component. To add a top margin to form elements, when they stack on smaller viewports, just add the data-uk-margin attribute from the Utility component to the parent element.NOTE In this example we used a button from the Button component. To add a top margin to form elements, when they stack on smaller viewports, just add the data-uk-margin attribute from the Utility component to the parent element. </textarea>
|
|
</form>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
|
|
<script charset="utf-8" id="seajsnode"src="http://static.alipayobjects.com/seajs/??seajs/2.2.0/sea.js,seajs-combo/1.0.1/seajs-combo.js,seajs-style/1.0.2/seajs-style.js"></script>
|
|
<script>
|
|
seajs.config({
|
|
base: 'http://static.alipayobjects.com/',
|
|
alias: {
|
|
'$' : 'jquery/jquery/1.7.2/jquery',
|
|
'Backbone': 'gallery/backbone/1.1.2/backbone.js'
|
|
}
|
|
});
|
|
|
|
seajs.use(['$', 'Backbone'], function($, Backbone) {
|
|
var Record = Backbone.Model.extend({
|
|
defaults:{
|
|
host:"",
|
|
path:"",
|
|
statusCode:"",
|
|
mimeType:""
|
|
},
|
|
initialize : function(){
|
|
|
|
}
|
|
});
|
|
|
|
var RecordList = Backbone.Collection.extend({
|
|
model:Record
|
|
});
|
|
|
|
var rec1 = new Record({statusCode:200, host:"www.baidu.com", path:"/search?a=b"});
|
|
var rec2 = new Record({statusCode:200, host:"www.bing.com", path:"/search?a=b"});
|
|
var rec3 = new Record({statusCode:200, host:"www.google.com", path:"/search?a=b"});
|
|
|
|
console.log([rec1,rec2,rec3] );
|
|
var recList = new RecordList( [rec1,rec2,rec3] );
|
|
console.log(recList.toJSON());
|
|
});
|
|
</script>
|
|
|
|
<style type="text/css">
|
|
.topHead{
|
|
background: #000;
|
|
color: rgb(204,204,204);
|
|
height: 42px;
|
|
position: relative;
|
|
}
|
|
|
|
.mainRecordTable{
|
|
margin-top: 0;
|
|
}
|
|
|
|
.uk-table-hover tbody tr:hover{
|
|
cursor: pointer;
|
|
background: #CCC;
|
|
}
|
|
|
|
.resHeader{
|
|
width: 400px;
|
|
}
|
|
|
|
.resBody textarea{
|
|
width: 400px;
|
|
height: 280px;
|
|
}
|
|
|
|
.subTitle{
|
|
padding-left: 6px;
|
|
border-left: 3px solid #1FA2D6;
|
|
font-size: 16px;
|
|
line-height: 16px;
|
|
}
|
|
|
|
.detail{
|
|
padding-left: 12px;
|
|
}
|
|
|
|
.recordDetailOverlay{
|
|
width: 600px;
|
|
height: 100%;
|
|
position: fixed;
|
|
right: 0;
|
|
background: #FFF;
|
|
border-left: 1px solid #CCC;
|
|
top: 0;
|
|
padding: 10px 10px 20px 10px;
|
|
overflow-y:scroll;
|
|
box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
-webkit-box-sizing: border-box;
|
|
}
|
|
|
|
|
|
</style>
|
|
</body>
|
|
</html> |