版本重构,加web管理方式

This commit is contained in:
刘河
2018-12-11 16:37:12 +08:00
parent 974f605ff6
commit abc30a9ad1
44 changed files with 20557 additions and 762 deletions

99
views/index/add.html Executable file
View File

@@ -0,0 +1,99 @@
<div class="row tile">
<div class="col-lg-12">
<div class="bs-component">
<div class="alert alert-dismissible alert-success">
<button class="close" type="button" data-dismiss="alert">×</button>
<span id="info"></span>
</div>
</div>
</div>
<div class="col-md-6 col-md-auto">
<div>
<h3 class="tile-title">添加</h3>
<div class="tile-body">
<form>
<div class="form-group">
<label class="control-label">模式</label>
<select class="form-control" name="type" id="type">
<option {{if eq "tunnelServer" .type}}selected{{end}} value="tunnelServer">tcp隧道</option>
<option {{if eq "udpServer" .type}}selected{{end}} value="udpServer">udp隧道</option>
<option {{if eq "sock5Server" .type}}selected{{end}} value="sock5Server">socks5代理</option>
<option {{if eq "httpProxyServer" .type}}selected{{end}} value="httpProxyServer">http代理
<option {{if eq "hostServer" .type}}selected{{end}} value="hostServer">host客户端</option>
</select>
</div>
<div class="form-group" id="port">
<label class="control-label">监听的端口</label>
<input class="form-control" type="text" name="port" placeholder="公网服务器对外访问端口例如8024">
</div>
<div class="form-group" id="target">
<label class="control-label">内网目标(ip:端口)</label>
<input class="form-control" type="text" name="target" placeholder="内网代理地址例如10.1.50.203:22">
</div>
<div class="form-group" id="compress">
<label class="control-label">数据压缩方式</label>
<select class="form-control" name="compress">
<option value="">不压缩</option>
<option value="gzip">gzip压缩</option>
<option value="snappy">snappy</option>
</select>
</div>
<div class="form-group" id="u">
<label class="control-label">socks5代理模式验证用户名</label>
<input class="form-control" type="text" name="u" placeholder="不填则无需验证">
</div>
<div class="form-group" id="p">
<label class="control-label">socks5代理模式验证密码</label>
<input class="form-control" type="text" name="p" placeholder="不填则无需验证">
</div>
</form>
</div>
<div class="tile-footer">
&nbsp;&nbsp;<button class="btn btn-success" href="#" id="add"><i
class="fa fa-fw fa-lg fa-eye"></i>添加
</button>
</div>
</div>
</div>
</div>
</main>
<script>
var arr = []
arr["all"] = ["type", "port", "compress", "u", "p", "target"]
arr["tunnelServer"] = ["type", "port", "target", "compress", "tcp隧道模式提供一条tcp隧道适用于ssh、远程桌面等添加后会自动生成一个客户端验证key<br>在内网机器执行<span style='color: red'>./easyProxy -vkey=生成的key -server=公网服务器ip:下面设定的端口</span><br>建立成功后,访问公网服务器的设定端口,则相当于访问内网目标地址的目标端口"]
arr["udpServer"] = ["type", "port", "target", "compress", "udp隧道模式提供一条udp隧道适用于dns、内网dns访问等添加后会自动生成一个客户端验证key<br>在内网机器执行<span style='color: red'>./easyProxy -vkey=生成的key -server=公网服务器ip:下面设定的端口</span><br>建立成功后访问公网服务器的设定端口则相当于访问内网目标地址的udp目标端口"]
arr["sock5Server"] = ["type", "port", "compress", "u", "p", "socks5代理模式内网socks5代理配合proxifer可如同使用vpn一样访问内网设备或资源添加后会自动生成一个客户端验证key<br>在内网机器执行<span style='color: red'>./easyProxy -vkey=生成的key -server=公网服务器ip:下面设定的端口</span><br>建立成功后在外网环境下本机配置socks5代理即访问内网设备或者资源 "]
arr["httpProxyServer"] = ["type", "port", "compress", " http代理模式内网http代理可访问内网网站添加后会自动生成一个客户端验证key<br>在内网机器执行<span style='color: red'>./easyProxy -vkey=生成的key -server=公网服务器ip:下面设定的端口</span><br>建立成功后在外网环境下本机配置http代理即访问内网站点"]
arr["hostServer"] = ["type", "compress", "域名分发模式使用域名代理内网服务适用于小程序开发、公众号开发、站点演示等添加后会自动生成一个客户端验证key<br>在内网机器执行<span style='color: red'>./easyProxy -vkey=生成的key -server=公网服务器ip:下面设定的端口</span><br>建立成功后使用nginx将请求反向代理到本程序再进行域名配置即可解析"]
function resetForm() {
for (var i = 0; i < arr["all"].length; i++) {
$("#" + arr["all"][i]).css("display", "none")
}
o = $("#type option:selected").val()
for (var i = 0; i < arr[o].length - 1; i++) {
$("#" + arr[o][i]).css("display", "block")
}
$("#info").html(arr[o][arr[o].length - 1])
}
$(function () {
resetForm()
$("#type").on("change", function () {
resetForm()
})
$("#add").on("click", function () {
$.ajax({
type: "POST",
url: "/index/add",
data: $("form").serializeArray(),
success: function (res) {
alert(res.msg)
if (res.status) {
history.back(-1)
}
}
})
})
})
</script>

94
views/index/edit.html Executable file
View File

@@ -0,0 +1,94 @@
<div class="row tile">
<div class="col-md-6 col-md-auto">
<div>
<h3 class="tile-title">添加</h3>
<div class="tile-body">
<form>
<input type="hidden" name="vKey" value="{{.t.VerifyKey}}">
<div class="form-group">
<label class="control-label">模式</label>
<select class="form-control" name="type" id="type">
<option {{if eq "tunnelServer" .t.Mode}}selected{{end}} value="tunnelServer">tcp隧道</option>
<option {{if eq "udpServer" .t.Mode}}selected{{end}} value="udpServer">udp隧道</option>
<option {{if eq "sock5Server" .t.Mode}}selected{{end}} value="sock5Server">socks5代理</option>
<option {{if eq "httpProxyServer" .t.Mode}}selected{{end}} value="httpProxyServer">http代理
<option {{if eq "hostServer" .t.Mode}}selected{{end}} value="hostServer">host客户端</option>
</select>
</div>
<div class="form-group" id="port">
<label class="control-label">监听的端口</label>
<input class="form-control" value="{{.t.TcpPort}}" type="text" name="port"
placeholder="公网服务器对外访问端口例如8024">
</div>
<div class="form-group" id="target">
<label class="control-label">内网目标(仅tcp、udp隧道模式需填写)</label>
<input class="form-control" value="{{.t.Target}}" type="text" name="target"
placeholder="内网隧道目标例如10.1.50.203:22">
</div>
<div class="form-group" id="compress">
<label class="control-label">数据压缩方式(所有模式均支持)</label>
<select class="form-control" name="compress">
<option {{if eq "" .t.Compress}}selected{{end}} value="">不压缩</option>
<option {{if eq "gzip" .t.Compress}}selected{{end}} value="gzip">gzip压缩</option>
<option {{if eq "snappy" .t.Compress}}selected{{end}} value="snappy">snappy压缩</option>
</select>
</div>
<div class="form-group" id="u">
<label class="control-label">socks5代理模式验证用户名</label>
<input class="form-control" value="{{.t.U}}" type="text" name="u"
placeholder="不填则无需验证,非socks5模式不填">
</div>
<div class="form-group" id="p">
<label class="control-label">socks5代理模式验证密码</label>
<input class="form-control" value="{{.t.P}}" type="text" name="p"
placeholder="不填则无需验证,非socks5模式不填">
</div>
</form>
</div>
<div class="tile-footer">
&nbsp;&nbsp;<button class="btn btn-success" href="#" id="add"><i
class="fa fa-fw fa-lg fa-eye"></i>保存
</button>
</div>
</div>
</div>
</div>
</main>
<script>
var arr = []
arr["all"] = ["type", "port", "compress", "u", "p","target"]
arr["tunnelServer"] = ["type", "port", "target", "compress"]
arr["udpServer"] = ["type", "port", "target", "compress"]
arr["sock5Server"] = ["type", "port", "compress", "u", "p"]
arr["httpProxyServer"] = ["type", "port", "compress"]
arr["hostServer"] = ["type", "compress"]
function resetForm() {
for (var i = 0; i < arr["all"].length; i++) {
$("#" + arr["all"][i]).css("display", "none")
}
o = $("#type option:selected").val()
for (var i = 0; i < arr[o].length; i++) {
$("#" + arr[o][i]).css("display", "block")
}
}
$(function () {
resetForm()
$("#type").on("change", function () {
resetForm()
})
$("#add").on("click", function () {
$.ajax({
type: "POST",
url: "/index/edit",
data: $("form").serializeArray(),
success: function (res) {
alert(res.msg)
if (res.status) {
history.back(-1)
}
}
})
})
})
</script>

43
views/index/hadd.html Executable file
View File

@@ -0,0 +1,43 @@
<div class="row tile">
<div class="col-md-6 col-md-auto">
<div>
<h3 class="tile-title">添加</h3>
<div class="tile-body">
<form>
<input type="hidden" name="vkey" value="{{.vkey}}">
<div class="form-group">
<label class="control-label">域名</label>
<input class="form-control" type="text" name="host" placeholder="域名">
</div>
<div class="form-group">
<label class="control-label">内网目标</label>
<input class="form-control" type="text" name="target" placeholder="内网隧道目标例如10.1.50.203:22">
</div>
</form>
</div>
<div class="tile-footer">
&nbsp;&nbsp;<button class="btn btn-success" href="#" id="add"><i
class="fa fa-fw fa-lg fa-eye"></i>添加
</button>
</div>
</div>
</div>
</div>
</main>
<script>
$(function () {
$("#add").on("click", function () {
$.ajax({
type: "POST",
url: "/index/addhost",
data: $("form").serializeArray(),
success: function (res) {
alert(res.msg)
if (res.status) {
history.back(-1)
}
}
})
})
})
</script>

81
views/index/hlist.html Executable file
View File

@@ -0,0 +1,81 @@
<div class="row">
<div class="col-md-12">
<div class="tile">
<div class="tile-body">
<table class="table table-hover table-bordered" id="sampleTable">
<thead>
<tr>
<th>客户端key</th>
<th>host</th>
<th>内网目标</th>
<th>操作</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</div>
</div>
</main>
<script type="text/javascript">
function del(host) {
if (confirm("确定要删除数据吗?")) {
$.ajax({
type: "POST",
url: "/index/delhost",
data: {"host": host},
success: function (res) {
alert(res.msg)
if (res.status) {
document.location.reload();
}
}
})
}
}
function add() {
window.location.href = "/index/addhost?vkey={{.vkey}}"
}
$(document).ready(function () {
var table = $('#sampleTable').DataTable({
dom: 'Bfrtip',
processing: true,
serverSide: true,
autoWidth: false,
ordering: false,
ajax: {
url: window.location,
type: 'POST'
},
dom: '<"top"fl><"toolbar">rt<"bottom"ip><"clear">',
columns: [ //这个是显示到界面上的个数据 格式为 {data:'显示的字段名'}
{data: 'Vkey'},
{data: 'Host'},
{data: 'Target'},
{data: 'Target'},
],
bFilter: false,
columnDefs: [{
targets: -1,
render: function (data, type, row, meta) {
return '<div class="btn-group" role="group" aria-label="..."> ' +
'<button onclick="del(\'' + row.Host + '\')" type="button" class="btn btn-danger btn-sm">删除</button>' +
' </div>'
}
}
],
buttons: []
});
$("#sampleTable_length").html('<button class="btn btn-primary" onclick="add()" type="button">新增</button>')
})
;
</script>

152
views/index/index.html Executable file
View File

@@ -0,0 +1,152 @@
<div class="row">
<div class="col-md-12">
<div class="tile">
<iframe src="https://ghbtns.com/github-btn.html?user=cnlh&repo=easyProxy&type=star&count=true&size=large"
frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
<iframe src="https://ghbtns.com/github-btn.html?user=cnlh&repo=easyProxy&type=watch&count=true&size=large&v=2"
frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
<iframe src="https://ghbtns.com/github-btn.html?user=cnlh&repo=easyProxy&type=fork&count=true&size=large"
frameborder="0" scrolling="0" width="158px" height="30px"></iframe>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="tile">
<h3 class="tile-title">域名代理模式</h3>
<p>
<b>适用范围:</b> 小程序开发、微信公众号开发、产品演示
</p>
<p>
<b>假设场景:</b>
<li>有一个域名proxy.com有一台公网机器ip为{{.ip}}</li>
<li>两个内网开发站点127.0.0.1:81127.0.0.1:82</li>
<li>想通过a.proxy.com访问127.0.0.1:81通过b.proxy.com访问127.0.0.1:82</li>
</p>
<p><b>使用步骤:</b></p>
<ul>
<li>将a.proxy.comb.proxy.com解析到公网服务器{{.ip}}</li>
<li>使用nginx监听这两个个域名并配置ssl等……</li>
<li>在nginx配置中添加反向代理<br>
<pre><code>
server {
listen 80;
server_name a.proxy.com b.proxy.com;#也可以是泛解析*.proxy.com
#ssl等配置
<b>location / {
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $http_host;
proxy_set_header X-Nginx-Proxy true;
proxy_set_header Connection "";
proxy_pass http://127.0.0.1:{{.proxyPort}};
}</b>
}
</code></pre>
</li>
<li>在域名代理管理中添加一个客户端,选择压缩方式,保存。 <a href="/index/add?type=hostServer">立即添加</a></li>
{{/*<li>在域名代理管理中找到新加的客户端(查看其vkey或者客户端命令),任意内网机器执行客户端命令</li>*/}}
<li>点击该客户端的域名管理添加两条规则规则1、域名a.proxy.com内网目标127.0.0.1:812、域名b.proxy.com内网目标127.0.0.1:82</li>
<li>现在访问a.proxy.comb.proxy.com即可成功</li>
</ul>
<p>上文中提到公网ip{{.ip}})为系统自动识别,如果是在测试环境中请自行对应,默认启动方式为单客户端模式,默认内网客户端已经启动</p>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="tile">
<h3 class="tile-title">tcp隧道模式</h3>
<p>
<b>适用范围:</b> ssh、远程桌面等tcp连接场景
</p>
<p>
<b>假设场景:</b> 想通过访问公网服务器{{.ip}}的8001端口连接内网机器10.1.50.101的22端口实现ssh连接
</p>
<p><b>使用步骤:</b></p>
<ul>
<li>在tcp隧道管理中添加一条隧道填写监听的端口8001、内网目标ip和目标端口10.1.50.101:22选择压缩方式保存。 <a
href="/index/add?type=tunnelServer">立即添加</a></li>
{{/*<li>在tcp管理列表中找到新加的隧道(查看其vkey或者客户端命令),任意内网机器执行客户端命令</li>*/}}
<li>访问公网服务器ip{{.ip}}:填写的监听端口(8001)相当于访问内网ip(10.1.50.101):目标端口(22)例如ssh -p 8001 root@{{.ip}}</li>
</ul>
<p>上文中提到公网ip{{.ip}})为系统自动识别,如果是在测试环境中请自行对应,默认启动方式为单客户端模式,默认内网客户端已经启动</p>
</div>
</div>
<div class="col-md-6">
<div class="tile">
<h3 class="tile-title">udp隧道模式</h3>
<p>
<b>适用范围:</b> 内网dns解析等udp连接场景
</p>
<p>
<b>假设场景:</b> 内网有一台dns10.1.50.102:53在非内网环境下想使用该dns公网服务器为{{.ip}}
</p>
<p><b>使用步骤:</b></p>
<ul>
<li>在udp隧道管理中添加一条隧道填写监听的端口8002、内网目标ip和目标端口10.1.50.102:53选择压缩方式保存。 <a
href="/index/add?type=udpServer">立即添加</a></li>
{{/*<li>在udp管理列表中找到新加的隧道(查看其vkey或者客户端命令),任意内网机器执行客户端命令</li>*/}}
<li>修改本机dns为{{.ip}}则相当于使用10.1.50.202作为dns服务器</li>
</ul>
<p>上文中提到公网ip{{.ip}})为系统自动识别,如果是在测试环境中请自行对应,默认启动方式为单客户端模式,默认内网客户端已经启动</p>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="tile">
<h3 class="tile-title">socks5代理模式</h3>
<p>
<b>适用范围:</b> 在外网环境下如同使用vpn一样访问内网设备或者资源
</p>
<p>
<b>假设场景:</b> 想将公网服务器{{.ip}}的8003端口作为socks5代理达到访问内网任意设备或者资源的效果
</p>
<p><b>使用步骤:</b></p>
<ul>
<li>在socks5隧道管理中添加一条隧道填写监听的端口8003验证用户名和密码自行选择建议先不填部分客户端不支持proxifer支持选择压缩方式保存。 <a
href="/index/add?type=sock5Server">立即添加</a></li>
{{/*<li>在socks5代理管理列表中找到新加的隧道(查看其vkey或者客户端命令),任意内网机器执行客户端命令</li>*/}}
<li>在外网环境的本机配置socks5代理ip为公网服务器ip{{.ip}}),端口为填写的监听端口(8003),即可畅享内网了</li>
</ul>
<p>上文中提到公网ip{{.ip}})为系统自动识别,如果是在测试环境中请自行对应,默认启动方式为单客户端模式,默认内网客户端已经启动</p>
</div>
</div>
<div class="col-md-6">
<div class="tile">
<h3 class="tile-title">http代理模式</h3>
<p>
<b>适用范围:</b> 在外网环境下访问内网站点
</p>
<p>
<b>假设场景:</b> 想将公网服务器{{.ip}}的8004端口作为http代理访问内网网站
</p>
<p><b>使用步骤:</b></p>
<ul>
<li>在http隧道管理中添加一条隧道填写监听的端口8004选择压缩方式保存。 <a
href="/index/add?type=httpProxyServer">立即添加</a></li>
<li>在http代理管理列表中找到新加的隧道(查看其vkey或者客户端命令),任意内网机器执行客户端命令</li>
<li>在外网环境的本机配置http代理ip为公网服务器ip{{.ip}}),端口为填写的监听端口(8004),即可访问了</li>
</ul>
<p>上文中提到公网ip{{.ip}})为系统自动识别,如果是在测试环境中请自行对应,默认启动方式为单客户端模式,默认内网客户端已经启动</p>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="tile">
<p>
<b>多客户端模式:</b>
<li>服务端启动:./easyProxy -mode=webServer -tcpport=8284</li>
<li>客户端启动:./easyProxy -server={{.ip}}:{{.p}} -vkey=xxx见管理列表的客户端启动模式</li>
</p>
<p><b>支持客户端同时建立多条隧道,例如单个通道时命令为./easyProxy -server={{.ip}}:{{.p}} -vkey=ccc如果要支持另外一个隧道则对应的执行命令为./easyProxy
-server={{.ip}}:{{.p}} -vkey=ccc,ddd即用逗号分隔开多个vkey适用于所有模式</b></p>
</div>
</div>
</div>
</main>

174
views/index/list.html Executable file
View File

@@ -0,0 +1,174 @@
<div class="row">
<div class="col-md-12">
<div class="tile">
<div class="tile-body">
<table class="table table-hover table-bordered" id="sampleTable">
<thead>
<tr>
{{/*<th>模式</th>*/}}
<th>监听端口</th>
<th>内网目标</th>
<th>多客户端模式客户端执行命令</th>
<th>压缩方式</th>
<th>用户名</th>
<th>密码</th>
<th>客户端状态</th>
<th>状态</th>
<th>操作</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</div>
</div>
</main>
<script type="text/javascript">
function del(vKey) {
if (confirm("确定要删除数据吗?")) {
$.ajax({
type: "POST",
url: "/index/del",
data: {"vKey": vKey},
success: function (res) {
alert(res.msg)
if (res.status) {
document.location.reload();
}
}
})
}
}
function start(vKey) {
if (confirm("确定要开始任务吗?")) {
$.ajax({
type: "POST",
url: "/index/start",
data: {"vKey": vKey},
success: function (res) {
alert(res.msg)
if (res.status) {
document.location.reload();
}
}
})
}
}
function stop(vKey) {
if (confirm("确定要暂停吗?")) {
$.ajax({
type: "POST",
url: "/index/stop",
data: {"vKey": vKey},
success: function (res) {
alert(res.msg)
if (res.status) {
document.location.reload();
}
}
})
}
}
function edit(vKey) {
window.location.href = "/index/edit?vKey=" + vKey
}
function add() {
window.location.href = "/index/add?type=" +{{.type}}
}
function hostList(vkey) {
window.location.href = "/index/hostlist?vkey=" + vkey
}
$(document).ready(function () {
var table = $('#sampleTable').DataTable({
dom: 'Bfrtip',
processing: true,
serverSide: true,
autoWidth: false,
ordering: false,
ajax: {
url: '/index/gettasklist?type={{.type}}',
type: 'POST'
},
dom: '<"top"fl><"toolbar">rt<"bottom"ip><"clear">',
columns: [ //这个是显示到界面上的个数据 格式为 {data:'显示的字段名'}
// {data: 'Mode'},
{data: 'TcpPort'},
{data: 'Target'},
{data: 'VerifyKey'},
{data: 'Compress'},
{data: 'U'},
{data: 'P'},
{data: 'ClientStatus'},
{data: 'IsRun'},
{data: "Id"}
],
bFilter: false,
columnDefs: [{
targets: -1,
render: function (data, type, row, meta) {
if (row.IsRun == 1) {
btn = "<button onclick=\"stop('" + row.VerifyKey + "')\" class=\"btn btn-secondary btn-sm\" type=\"button\">关闭</button>"
} else {
btn = "<button onclick=\"start('" + row.VerifyKey + "')\" class=\"btn btn-success btn-sm\" type=\"button\">打开</button>"
}
btn_edit = '<button onclick="edit(\'' + row.VerifyKey + '\')" type="button" class="btn btn-primary btn-sm">查看编辑</button> '
if ({{.type}} == "hostServer"
)
{
btn_host = '<button onclick="hostList(\'' + row.VerifyKey + '\')" type="button" class="btn btn-info btn-sm">域名管理</button> '
}
else
{
btn_host = ""
}
return '<div class="btn-group" role="group" aria-label="..."> ' +
'<button onclick="del(\'' + row.VerifyKey + '\')" type="button" class="btn btn-danger btn-sm">删除</button>' +
btn_edit + btn + btn_host + ' </div>'
}
},
{
targets: -2,
render: function (data, type, row, meta) {
if (data == 0) {
return "<span class=\"badge badge-pill badge-secondary\">暂停</span>"
} else {
return "<span class=\"badge badge-pill badge-success\">正常</span>"
}
}
},
{
targets: 2,
render: function (data, type, row, meta) {
return "./easyProxy -server={{.ip}}:{{.p}} -vkey=" + data
// return data
}
},
{
targets: -3,
render: function (data, type, row, meta) {
if (data == 0) {
return "<span class=\"badge badge-pill badge-secondary\">离线</span>"
} else {
return "<span class=\"badge badge-pill badge-success\">在线</span>"
}
}
}
],
buttons: []
});
$("#sampleTable_length").html('<button class="btn btn-primary" onclick="add()" type="button">新增</button>')
})
;
</script>