mirror of
https://github.com/warmcat/libwebsockets.git
synced 2025-03-09 00:00:04 +01:00
test-app: upgrade test.html to have separate css and js for CSP
This commit is contained in:
Andy Green
parent
c1a1e38de0
commit
97f3e66f3c
7 changed files with 1210 additions and 999 deletions
|
|
@ -1751,7 +1751,9 @@ if ((LWS_ROLE_H1 OR LWS_ROLE_H2) AND NOT LWS_WITHOUT_TESTAPPS)
|
|||
"${PROJECT_SOURCE_DIR}/test-apps/http2.png"
|
||||
"${PROJECT_SOURCE_DIR}/test-apps/wss-over-h2.png"
|
||||
"${PROJECT_SOURCE_DIR}/test-apps/lws-common.js"
|
||||
"${PROJECT_SOURCE_DIR}/test-apps/test.html")
|
||||
"${PROJECT_SOURCE_DIR}/test-apps/test.html"
|
||||
"${PROJECT_SOURCE_DIR}/test-apps/test.css"
|
||||
"${PROJECT_SOURCE_DIR}/test-apps/test.js")
|
||||
|
||||
add_custom_command(TARGET test-server
|
||||
POST_BUILD
|
||||
|
|
@ -2126,7 +2128,7 @@ if (LWS_WITH_PLUGINS)
|
|||
DESTINATION share/libwebsockets-test-server/plugins
|
||||
COMPONENT plugins)
|
||||
if (LWS_WITH_SERVER_STATUS)
|
||||
install(FILES plugins/server-status.html;plugins/lwsws-logo.png
|
||||
install(FILES plugins/server-status.html;plugins/server-status.js;plugins/server-status.css;plugins/lwsws-logo.png
|
||||
DESTINATION share/libwebsockets-test-server/server-status
|
||||
COMPONENT examples)
|
||||
endif()
|
||||
|
|
|
|||
190
plugins/server-status.css
Normal file
190
plugins/server-status.css
Normal file
|
|
@ -0,0 +1,190 @@
|
|||
|
||||
span.title {
|
||||
font-size:18pt;
|
||||
font-family: Arial;
|
||||
font-weight:normal;
|
||||
text-align:center;
|
||||
color:#000000;
|
||||
}
|
||||
span.mount {
|
||||
font-size:10pt;
|
||||
font-family: Arial;
|
||||
font-weight:normal;
|
||||
text-align:center;
|
||||
color:#000000;
|
||||
}
|
||||
span.mountname {
|
||||
font-size:14pt;
|
||||
font-family: Arial;
|
||||
font-weight:bold;
|
||||
text-align:center;
|
||||
color:#404010;
|
||||
}
|
||||
span.n {
|
||||
font-size:12pt;
|
||||
font-family: Arial;
|
||||
font-weight:normal;
|
||||
text-align:center;
|
||||
color:#808020;
|
||||
}
|
||||
span.v {
|
||||
font-size:12pt;
|
||||
font-family: Arial;
|
||||
font-weight:bold;
|
||||
text-align:center;
|
||||
color:#202020;
|
||||
}
|
||||
span.m1 {
|
||||
font-size:12pt;
|
||||
font-family: Arial;
|
||||
font-weight:bold;
|
||||
text-align:center;
|
||||
color:#202020;
|
||||
}
|
||||
span.m2 {
|
||||
font-size:12pt;
|
||||
font-family: Arial;
|
||||
font-weight:normal;
|
||||
text-align:center;
|
||||
color:#202020;
|
||||
}
|
||||
|
||||
.browser { font-size:12pt; font-family: Arial; font-weight:normal; text-align:center; color:#ffff00; vertical-align:middle; text-align:center; background:#d0b070; padding:12px; -webkit-border-radius:10px; border-radius:10px;}
|
||||
.group2 { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#f0f0e0;
|
||||
padding:12px;
|
||||
-webkit-border-radius:10px;
|
||||
border-radius:10px; }
|
||||
.explain { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#f0f0c0; padding:12px;
|
||||
-webkit-border-radius:10px;
|
||||
border-radius:10px;
|
||||
color:#404000;
|
||||
padding:3px;
|
||||
}
|
||||
td.wsstatus { vertical-align:middle; width:200px; height:50px;
|
||||
text-align:center;
|
||||
background:#f0f0c0; padding:6px;
|
||||
-webkit-border-radius:8px;
|
||||
border-radius:8px;
|
||||
color:#404000; }
|
||||
.tdform { vertical-align:middle; width:200px; height:50px;
|
||||
text-align:center;
|
||||
background:#f0f0d0; padding:6px;
|
||||
-webkit-border-radius:8px;
|
||||
margin:10px;
|
||||
border-radius:8px;
|
||||
border: 1px solid black;
|
||||
border-collapse: collapse;font-size:18pt; font-family: Arial; font-weight:normal; text-align:center; color:#000000;
|
||||
color:#404000; }
|
||||
|
||||
td.l { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#d0d0b0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
|
||||
td.bigger { font-size:120%; }
|
||||
|
||||
div.bgw { background:white }
|
||||
div.conninfo {
|
||||
border: solid 2px #e0d040;
|
||||
padding: 4px;
|
||||
width: 500px;
|
||||
height:350px;
|
||||
overflow: auto;
|
||||
}
|
||||
span.f12 { font-size:12pt }
|
||||
|
||||
.content { vertical-align:top; text-align:center; background:#fffff0; padding:12px; -webkit-border-radius:10px; border-radius:10px; }
|
||||
.canvas { vertical-align:top; text-align:center; background:#efefd0; padding:12px; -webkit-border-radius:10px; border-radius:10px; }
|
||||
.tabs {
|
||||
position: relative;
|
||||
min-height: 750px; /* This part sucks */
|
||||
clear: both;
|
||||
margin: 25px 0;
|
||||
}
|
||||
.tab {
|
||||
float: left;
|
||||
}
|
||||
.tab label {
|
||||
background: #eee;
|
||||
padding: 10px;
|
||||
border: 1px solid #ccc;
|
||||
margin-left: -1px;
|
||||
position: relative;
|
||||
left: 1px;
|
||||
}
|
||||
.tab [type=radio] {
|
||||
display: none;
|
||||
}
|
||||
.content {
|
||||
position: absolute;
|
||||
top: 28px;
|
||||
left: 0;
|
||||
background: white;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
padding: 20px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
[type=radio]:checked ~ label {
|
||||
background: white;
|
||||
border-bottom: 1px solid white;
|
||||
z-index: 2;
|
||||
}
|
||||
[type=radio]:checked ~ label ~ .content {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
td.wsstatus { vertical-align:middle; width:200px; height:50px;
|
||||
text-align:center;
|
||||
background:#f0f0c0; padding:6px;
|
||||
-webkit-border-radius:8px;
|
||||
border-radius:8px;
|
||||
color:#404000; }
|
||||
td.l { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#d0d0b0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
td.dl { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#c0c0c0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
td.c { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#c0c0a0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
td.c0 { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#b0b090;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
td.dc0 { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#a0a0a0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
td.c1 { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#c0c0c0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
td.t { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#e0e0c0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
|
|
@ -2,125 +2,10 @@
|
|||
<html lang="en">
|
||||
<head>
|
||||
<meta charset=utf-8 http-equiv="Content-Language" content="en"/>
|
||||
<link rel="stylesheet" type="text/css" href="server-status.css"/>
|
||||
<script src="/lws-common.js"></script>
|
||||
<script type='text/javascript' src='server-status.js'></script>
|
||||
<title>LWS Server Status</title>
|
||||
<style type="text/css">
|
||||
span.title { font-size:18pt; font-family: Arial; font-weight:normal;
|
||||
text-align:center; color:#000000; }
|
||||
span.mount { font-size:10pt; font-family: Arial; font-weight:normal;
|
||||
text-align:center; color:#000000; }
|
||||
span.mountname { font-size:14pt; font-family: Arial; font-weight:bold;
|
||||
text-align:center; color:#404010; }
|
||||
span.n { font-size:12pt; font-family: Arial; font-weight:normal;
|
||||
text-align:center; color:#808020; }
|
||||
span.v { font-size:12pt; font-family: Arial; font-weight:bold;
|
||||
text-align:center; color:#202020; }
|
||||
span.m1 { font-size:12pt; font-family: Arial; font-weight:bold;
|
||||
text-align:center; color:#202020; }
|
||||
span.m2 { font-size:12pt; font-family: Arial; font-weight:normal;
|
||||
text-align:center; color:#202020; }
|
||||
.browser { font-size:18pt; font-family: Arial; font-weight:normal; text-align:center; color:#ffff00; vertical-align:middle; text-align:center; background:#d0b070; padding:12px; -webkit-border-radius:10px; border-radius:10px;}
|
||||
.group2 { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#f0f0e0;
|
||||
padding:12px;
|
||||
-webkit-border-radius:10px;
|
||||
border-radius:10px; }
|
||||
.explain { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#f0f0c0; padding:12px;
|
||||
-webkit-border-radius:10px;
|
||||
border-radius:10px;
|
||||
color:#404000; }
|
||||
td.wsstatus { vertical-align:middle; width:200px; height:50px;
|
||||
text-align:center;
|
||||
background:#f0f0c0; padding:6px;
|
||||
-webkit-border-radius:8px;
|
||||
border-radius:8px;
|
||||
color:#404000; }
|
||||
td.l { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#d0d0b0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
td.dl { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#c0c0c0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
td.c { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#c0c0a0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
td.c0 { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#b0b090;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
td.dc0 { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#a0a0a0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
td.c1 { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#c0c0c0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
td.t { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#e0e0c0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
.content { vertical-align:top; text-align:center; background:#fffff0; padding:12px; -webkit-border-radius:10px; border-radius:10px; }
|
||||
.canvas { vertical-align:top; text-align:center; background:#efefd0; padding:12px; -webkit-border-radius:10px; border-radius:10px; }
|
||||
.tabs {
|
||||
position: relative;
|
||||
min-height: 750px; /* This part sucks */
|
||||
clear: both;
|
||||
margin: 25px 0;
|
||||
}
|
||||
.tab {
|
||||
float: left;
|
||||
}
|
||||
.tab label {
|
||||
background: #eee;
|
||||
padding: 10px;
|
||||
border: 1px solid #ccc;
|
||||
margin-left: -1px;
|
||||
position: relative;
|
||||
left: 1px;
|
||||
}
|
||||
.tab [type=radio] {
|
||||
display: none;
|
||||
}
|
||||
.content {
|
||||
position: absolute;
|
||||
top: 28px;
|
||||
left: 0;
|
||||
background: white;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
padding: 20px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
[type=radio]:checked ~ label {
|
||||
background: white;
|
||||
border-bottom: 1px solid white;
|
||||
z-index: 2;
|
||||
}
|
||||
[type=radio]:checked ~ label ~ .content {
|
||||
z-index: 1;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
|
@ -128,250 +13,13 @@
|
|||
<article>
|
||||
|
||||
<table>
|
||||
<tr><td><img src="./lwsws-logo.png"></td><td><span id=title class=title>Server status</span></td></tr>
|
||||
<tr><td><img src="./lwsws-logo.png"></td><td>
|
||||
<span id=title class=title>Server status</span></td></tr>
|
||||
<tr><td align=center colspan=2>
|
||||
<div id="conninfo">...</div>
|
||||
<div id="json"></div>
|
||||
</td></tr>
|
||||
|
||||
|
||||
</table>
|
||||
|
||||
</article>
|
||||
|
||||
<script nonce="lwscaro">
|
||||
|
||||
lws_gray_out(true,{'zindex':'499'});
|
||||
|
||||
/*
|
||||
* We display untrusted stuff in html context... reject anything
|
||||
* that has HTML stuff in it
|
||||
*/
|
||||
|
||||
function san(s)
|
||||
{
|
||||
if (s.search("<") != -1)
|
||||
return "invalid string";
|
||||
|
||||
return s;
|
||||
}
|
||||
|
||||
function humanize(s)
|
||||
{
|
||||
i = parseInt(s);
|
||||
|
||||
if (i > 1000000000)
|
||||
return (i / 1000000000).toFixed(3) + "G";
|
||||
|
||||
if (i > 1000000)
|
||||
return (i / 1000000).toFixed(3) + "M";
|
||||
|
||||
if (i > 1000)
|
||||
return (i / 1000).toFixed(3) + "K";
|
||||
|
||||
return s;
|
||||
}
|
||||
|
||||
var pos = 0;
|
||||
|
||||
function get_appropriate_ws_url()
|
||||
{
|
||||
var pcol;
|
||||
var u = document.URL;
|
||||
|
||||
/*
|
||||
* We open the websocket encrypted if this page came on an
|
||||
* https:// url itself, otherwise unencrypted
|
||||
*/
|
||||
|
||||
if (u.substring(0, 5) == "https") {
|
||||
pcol = "wss://";
|
||||
u = u.substr(8);
|
||||
} else {
|
||||
pcol = "ws://";
|
||||
if (u.substring(0, 4) == "http")
|
||||
u = u.substr(7);
|
||||
}
|
||||
|
||||
u = u.split('/');
|
||||
|
||||
/* + "/xxx" bit is for IE10 workaround */
|
||||
|
||||
return pcol + u[0] + "/xxx";
|
||||
}
|
||||
|
||||
|
||||
var socket_status, jso, s;
|
||||
|
||||
if (typeof MozWebSocket != "undefined") {
|
||||
socket_status = new MozWebSocket(get_appropriate_ws_url(),
|
||||
"lws-server-status");
|
||||
} else {
|
||||
socket_status = new WebSocket(get_appropriate_ws_url(),
|
||||
"lws-server-status");
|
||||
}
|
||||
|
||||
|
||||
try {
|
||||
socket_status.onopen = function() {
|
||||
document.getElementById("title").innerHTML = "Server Status (Active)";
|
||||
lws_gray_out(false);
|
||||
}
|
||||
|
||||
socket_status.onmessage =function got_packet(msg) {
|
||||
var u, ci, n;
|
||||
//document.getElementById("json").innerHTML = "<pre>"+msg.data+"</pre>";
|
||||
jso = JSON.parse(msg.data);
|
||||
u = parseInt(san(jso.i.uptime));
|
||||
|
||||
if (parseInt(jso.i.contexts[0].deprecated) == 0)
|
||||
s = "<table><tr><td></td><td class=\"c0\">";
|
||||
else
|
||||
s = "<table><tr><td></td><td class=\"dc0\">";
|
||||
s +=
|
||||
"Server</td><td>" +
|
||||
"<span class=n>Version:</span> <span class=v>" +
|
||||
san(jso.i.version) + "</span><br>" +
|
||||
"<span class=n>Uptime:</span> <span class=v>" +
|
||||
((u / (24 * 3600)) | 0) + "d " +
|
||||
(((u % (24 * 3600)) / 3600) | 0) + "h " +
|
||||
(((u % 3600) / 60) | 0) + "m</span>";
|
||||
if (jso.i.l1)
|
||||
s = s + ", <span class=n>Load:</span> <span class=v>" + san(jso.i.l1) + " ";
|
||||
if (jso.i.l2)
|
||||
s = s + san(jso.i.l2) + " ";
|
||||
if (jso.i.l3)
|
||||
s = s + san(jso.i.l3);
|
||||
if (jso.i.l1)
|
||||
s =s + "<span>";
|
||||
|
||||
for (n = 0; n < jso.files.length; n++) {
|
||||
s += "<br><span class=n>" + san(jso.files[n].path) + ":</span><br> " + san(jso.files[n].val);
|
||||
}
|
||||
s += "</td></tr>";
|
||||
|
||||
for (ci = 0; ci < jso.i.contexts.length; ci++) {
|
||||
|
||||
if (parseInt(jso.i.contexts[ci].deprecated) == 0)
|
||||
s += "<tr><td></td><td class=\"c\">" +
|
||||
"Active Context</td><td>";
|
||||
else
|
||||
s += "<tr><td></td><td class=\"c1\">" +
|
||||
"Deprecated Context " + ci + "</td><td>";
|
||||
|
||||
u = parseInt(san(jso.i.contexts[ci].context_uptime));
|
||||
s += "<span class=n>Uptime:</span> <span class=v>" +
|
||||
((u / (24 * 3600)) | 0) + "d " +
|
||||
(((u % (24 * 3600)) / 3600) | 0) + "h " +
|
||||
(((u % 3600) / 60) | 0) + "m</span>";
|
||||
|
||||
s = s +
|
||||
"<br>" +
|
||||
"<span class=n>Listening wsi:</span> <span class=v>" + san(jso.i.contexts[ci].listen_wsi) + "</span>, " +
|
||||
"<span class=n>Current wsi alive:</span> <span class=v>" + (parseInt(san(jso.i.contexts[ci].wsi_alive)) -
|
||||
parseInt(san(jso.i.contexts[ci].listen_wsi))) + "</span><br>" +
|
||||
"<span class=n>Total Rx:</span> <span class=v>" + humanize(san(jso.i.contexts[ci].rx)) +"</span>, " +
|
||||
"<span class=n>Total Tx:</span> <span class=v>" + humanize(san(jso.i.contexts[ci].tx)) +"</span><br>" +
|
||||
|
||||
"<span class=n>CONNECTIONS: HTTP/1.x:</span> <span class=v>" + san(jso.i.contexts[ci].h1_conn) +"</span>, " +
|
||||
"<span class=n>Websocket:</span> <span class=v>" + san(jso.i.contexts[ci].ws_upg) +"</span>, " +
|
||||
"<span class=n>H2 upgrade:</span> <span class=v>" + san(jso.i.contexts[ci].h2_upg) +"</span>, " +
|
||||
"<span class=n>H2 ALPN:</span> <span class=v>" + san(jso.i.contexts[ci].h2_alpn) +"</span>, " +
|
||||
"<span class=n>Rejected:</span> <span class=v>" + san(jso.i.contexts[ci].rejected) +"</span><br>" +
|
||||
|
||||
"<span class=n>TRANSACTIONS: HTTP/1.x:</span> <span class=v>" + san(jso.i.contexts[ci].h1_trans) + "</span>, " +
|
||||
"<span class=n>H2:</span> <span class=v>" + san(jso.i.contexts[ci].h2_trans) +"</span>, " +
|
||||
"<span class=n>Total H2 substreams:</span> <span class=v>" + san(jso.i.contexts[ci].h2_subs) +"</span><br>" +
|
||||
|
||||
"<span class=n>CGI: alive:</span> <span class=v>" + san(jso.i.contexts[ci].cgi_alive) + "</span>, " +
|
||||
"<span class=n>spawned:</span> <span class=v>" + san(jso.i.contexts[ci].cgi_spawned) +
|
||||
"</span><table>";
|
||||
|
||||
for (n = 0; n < jso.i.contexts[ci].pt.length; n++) {
|
||||
|
||||
if (parseInt(jso.i.contexts[ci].deprecated) == 0)
|
||||
s += "<tr><td> </td><td class=\"l\">service thread " + (n + 1);
|
||||
else
|
||||
s += "<tr><td> </td><td class=\"dl\">service thread " + (n + 1);
|
||||
s += "</td><td>" +
|
||||
"<span class=n>fds:</span> <span class=v>" + san(jso.i.contexts[ci].pt[n].fds_count) + " / " +
|
||||
san(jso.i.contexts[ci].pt_fd_max) + "</span>, ";
|
||||
s = s + "<span class=n>ah pool:</span> <span class=v>" + san(jso.i.contexts[ci].pt[n].ah_pool_inuse) + " / " +
|
||||
san(jso.i.contexts[ci].ah_pool_max) + "</span>, " +
|
||||
"<span class=n>ah waiting list:</span> <span class=v>" + san(jso.i.contexts[ci].pt[n].ah_wait_list);
|
||||
|
||||
s = s + "</span></td></tr>";
|
||||
|
||||
}
|
||||
for (n = 0; n < jso.i.contexts[ci].vhosts.length; n++) {
|
||||
if (parseInt(jso.i.contexts[ci].deprecated) == 0)
|
||||
s += "<tr><td> </td><td class=\"l\">vhost " + (n + 1);
|
||||
else
|
||||
s += "<tr><td> </td><td class=\"dl\">vhost " + (n + 1);
|
||||
s += "</td><td><span class=\"mountname\">";
|
||||
if (jso.i.contexts[ci].vhosts[n].use_ssl == '1')
|
||||
s = s + "https://";
|
||||
else
|
||||
s = s + "http://";
|
||||
s = s + san(jso.i.contexts[ci].vhosts[n].name) + ":" +
|
||||
san(jso.i.contexts[ci].vhosts[n].port) + "</span>";
|
||||
if (jso.i.contexts[ci].vhosts[n].sts == '1')
|
||||
s = s + " (STS)";
|
||||
s = s +"<br>" +
|
||||
|
||||
"<span class=n>Total Rx:</span> <span class=v>" + humanize(san(jso.i.contexts[ci].vhosts[n].rx)) +"</span>, " +
|
||||
"<span class=n>Total Tx:</span> <span class=v>" + humanize(san(jso.i.contexts[ci].vhosts[n].tx)) +"</span><br>" +
|
||||
|
||||
"<span class=n>CONNECTIONS: HTTP/1.x:</span> <span class=v>" + san(jso.i.contexts[ci].vhosts[n].h1_conn) +"</span>, " +
|
||||
"<span class=n>Websocket:</span> <span class=v>" + san(jso.i.contexts[ci].vhosts[n].ws_upg) +"</span>, " +
|
||||
"<span class=n>H2 upgrade:</span> <span class=v>" + san(jso.i.contexts[ci].vhosts[n].h2_upg) +"</span>, " +
|
||||
"<span class=n>H2 ALPN:</span> <span class=v>" + san(jso.i.contexts[ci].vhosts[n].h2_alpn) +"</span>, " +
|
||||
"<span class=n>Rejected:</span> <span class=v>" + san(jso.i.contexts[ci].vhosts[n].rejected) +"</span><br>" +
|
||||
|
||||
"<span class=n>TRANSACTIONS: HTTP/1.x:</span> <span class=v>" + san(jso.i.contexts[ci].vhosts[n].h1_trans) + "</span>, " +
|
||||
"<span class=n>H2:</span> <span class=v>" + san(jso.i.contexts[ci].vhosts[n].h2_trans) +"</span>, " +
|
||||
"<span class=n>Total H2 substreams:</span> <span class=v>" + san(jso.i.contexts[ci].vhosts[n].h2_subs) +"</span><br>" +
|
||||
|
||||
"<table style=\"margin-left:16px\"><tr><td class=t>Mountpoint</td><td class=t>Origin</td><td class=t>Cache Policy</td></tr>";
|
||||
|
||||
var m;
|
||||
for (m = 0; m < jso.i.contexts[ci].vhosts[n].mounts.length; m++) {
|
||||
s = s + "<tr><td>";
|
||||
s = s + "<span class=\"m1\">" + san(jso.i.contexts[ci].vhosts[n].mounts[m].mountpoint) +
|
||||
"</span></td><td><span class=\"m2\">" +
|
||||
san(jso.i.contexts[ci].vhosts[n].mounts[m].origin) +
|
||||
"</span></td><td>";
|
||||
if (parseInt(san(jso.i.contexts[ci].vhosts[n].mounts[m].cache_max_age)))
|
||||
s = s + "<span class=n>max-age:</span> <span class=v>" +
|
||||
san(jso.i.contexts[ci].vhosts[n].mounts[m].cache_max_age) +
|
||||
"</span>, <span class=n>reuse:</span> <span class=v>" +
|
||||
san(jso.i.contexts[ci].vhosts[n].mounts[m].cache_reuse) +
|
||||
"</span>, <span class=n>reval:</span> <span class=v>" +
|
||||
san(jso.i.contexts[ci].vhosts[n].mounts[m].cache_revalidate) +
|
||||
"</span>, <span class=n>inter:</span> <span class=v>" +
|
||||
san(jso.i.contexts[ci].vhosts[n].mounts[m].cache_intermediaries);
|
||||
s = s + "</span></td></tr>"
|
||||
}
|
||||
s = s + "</table>";
|
||||
s = s + "</td></tr>";
|
||||
}
|
||||
|
||||
s += "</table></td></tr>";
|
||||
|
||||
} // context
|
||||
s = s + "</table>";
|
||||
|
||||
document.getElementById("conninfo").innerHTML = s;
|
||||
}
|
||||
|
||||
socket_status.onclose = function(){
|
||||
document.getElementById("title").innerHTML = "Server Status (Disconnected)";
|
||||
lws_gray_out(true,{'zindex':'499'});
|
||||
}
|
||||
} catch(exception) {
|
||||
alert('<p>Error' + exception);
|
||||
}
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
241
plugins/server-status.js
Normal file
241
plugins/server-status.js
Normal file
|
|
@ -0,0 +1,241 @@
|
|||
(function () {
|
||||
|
||||
/*
|
||||
* We display untrusted stuff in html context... reject anything
|
||||
* that has HTML stuff in it
|
||||
*/
|
||||
|
||||
function san(s)
|
||||
{
|
||||
if (s.search("<") != -1)
|
||||
return "invalid string";
|
||||
|
||||
return s;
|
||||
}
|
||||
|
||||
function humanize(s)
|
||||
{
|
||||
i = parseInt(s);
|
||||
|
||||
if (i > 1000000000)
|
||||
return (i / 1000000000).toFixed(3) + "G";
|
||||
|
||||
if (i > 1000000)
|
||||
return (i / 1000000).toFixed(3) + "M";
|
||||
|
||||
if (i > 1000)
|
||||
return (i / 1000).toFixed(3) + "K";
|
||||
|
||||
return s;
|
||||
}
|
||||
|
||||
var pos = 0;
|
||||
|
||||
function get_appropriate_ws_url()
|
||||
{
|
||||
var pcol;
|
||||
var u = document.URL;
|
||||
|
||||
/*
|
||||
* We open the websocket encrypted if this page came on an
|
||||
* https:// url itself, otherwise unencrypted
|
||||
*/
|
||||
|
||||
if (u.substring(0, 5) == "https") {
|
||||
pcol = "wss://";
|
||||
u = u.substr(8);
|
||||
} else {
|
||||
pcol = "ws://";
|
||||
if (u.substring(0, 4) == "http")
|
||||
u = u.substr(7);
|
||||
}
|
||||
|
||||
u = u.split('/');
|
||||
|
||||
/* + "/xxx" bit is for IE10 workaround */
|
||||
|
||||
return pcol + u[0] + "/xxx";
|
||||
}
|
||||
|
||||
|
||||
var socket_status, jso, s;
|
||||
|
||||
function ws_open_server_status()
|
||||
{
|
||||
socket_status = new WebSocket(get_appropriate_ws_url(),
|
||||
"lws-server-status");
|
||||
|
||||
try {
|
||||
socket_status.onopen = function() {
|
||||
document.getElementById("title").innerHTML = "Server Status (Active)";
|
||||
lws_gray_out(false);
|
||||
}
|
||||
|
||||
socket_status.onmessage =function got_packet(msg) {
|
||||
var u, ci, n;
|
||||
//document.getElementById("json").innerHTML = "<pre>"+msg.data+"</pre>";
|
||||
if (msg.data.length < 100)
|
||||
return;
|
||||
jso = JSON.parse(msg.data);
|
||||
u = parseInt(san(jso.i.uptime));
|
||||
|
||||
if (parseInt(jso.i.contexts[0].deprecated) == 0)
|
||||
s = "<table><tr><td></td><td class=\"c0\">";
|
||||
else
|
||||
s = "<table><tr><td></td><td class=\"dc0\">";
|
||||
s +=
|
||||
"Server</td><td>" +
|
||||
"<span class=n>Version:</span> <span class=v>" +
|
||||
san(jso.i.version) + "</span><br>" +
|
||||
"<span class=n>Uptime:</span> <span class=v>" +
|
||||
((u / (24 * 3600)) | 0) + "d " +
|
||||
(((u % (24 * 3600)) / 3600) | 0) + "h " +
|
||||
(((u % 3600) / 60) | 0) + "m</span>";
|
||||
if (jso.i.l1)
|
||||
s = s + ", <span class=n>Load:</span> <span class=v>" + san(jso.i.l1) + " ";
|
||||
if (jso.i.l2)
|
||||
s = s + san(jso.i.l2) + " ";
|
||||
if (jso.i.l3)
|
||||
s = s + san(jso.i.l3);
|
||||
if (jso.i.l1)
|
||||
s =s + "<span>";
|
||||
|
||||
for (n = 0; n < jso.files.length; n++) {
|
||||
s += "<br><span class=n>" + san(jso.files[n].path) + ":</span><br> " + san(jso.files[n].val);
|
||||
}
|
||||
s += "</td></tr>";
|
||||
|
||||
for (ci = 0; ci < jso.i.contexts.length; ci++) {
|
||||
|
||||
if (parseInt(jso.i.contexts[ci].deprecated) == 0)
|
||||
s += "<tr><td></td><td class=\"c\">" +
|
||||
"Active Context</td><td>";
|
||||
else
|
||||
s += "<tr><td></td><td class=\"c1\">" +
|
||||
"Deprecated Context " + ci + "</td><td>";
|
||||
|
||||
u = parseInt(san(jso.i.contexts[ci].context_uptime));
|
||||
s += "<span class=n>Uptime:</span> <span class=v>" +
|
||||
((u / (24 * 3600)) | 0) + "d " +
|
||||
(((u % (24 * 3600)) / 3600) | 0) + "h " +
|
||||
(((u % 3600) / 60) | 0) + "m</span>";
|
||||
|
||||
s = s +
|
||||
"<br>" +
|
||||
"<span class=n>Listening wsi:</span> <span class=v>" + san(jso.i.contexts[ci].listen_wsi) + "</span>, " +
|
||||
"<span class=n>Current wsi alive:</span> <span class=v>" + (parseInt(san(jso.i.contexts[ci].wsi_alive)) -
|
||||
parseInt(san(jso.i.contexts[ci].listen_wsi))) + "</span><br>" +
|
||||
"<span class=n>Total Rx:</span> <span class=v>" + humanize(san(jso.i.contexts[ci].rx)) +"</span>, " +
|
||||
"<span class=n>Total Tx:</span> <span class=v>" + humanize(san(jso.i.contexts[ci].tx)) +"</span><br>" +
|
||||
|
||||
"<span class=n>CONNECTIONS: HTTP/1.x:</span> <span class=v>" + san(jso.i.contexts[ci].h1_conn) +"</span>, " +
|
||||
"<span class=n>Websocket:</span> <span class=v>" + san(jso.i.contexts[ci].ws_upg) +"</span>, " +
|
||||
"<span class=n>H2 upgrade:</span> <span class=v>" + san(jso.i.contexts[ci].h2_upg) +"</span>, " +
|
||||
"<span class=n>H2 ALPN:</span> <span class=v>" + san(jso.i.contexts[ci].h2_alpn) +"</span>, " +
|
||||
"<span class=n>Rejected:</span> <span class=v>" + san(jso.i.contexts[ci].rejected) +"</span><br>" +
|
||||
|
||||
"<span class=n>TRANSACTIONS: HTTP/1.x:</span> <span class=v>" + san(jso.i.contexts[ci].h1_trans) + "</span>, " +
|
||||
"<span class=n>H2:</span> <span class=v>" + san(jso.i.contexts[ci].h2_trans) +"</span>, " +
|
||||
"<span class=n>Total H2 substreams:</span> <span class=v>" + san(jso.i.contexts[ci].h2_subs) +"</span><br>" +
|
||||
|
||||
"<span class=n>CGI: alive:</span> <span class=v>" + san(jso.i.contexts[ci].cgi_alive) + "</span>, " +
|
||||
"<span class=n>spawned:</span> <span class=v>" + san(jso.i.contexts[ci].cgi_spawned) +
|
||||
"</span><table>";
|
||||
|
||||
for (n = 0; n < jso.i.contexts[ci].pt.length; n++) {
|
||||
|
||||
if (parseInt(jso.i.contexts[ci].deprecated) == 0)
|
||||
s += "<tr><td> </td><td class=\"l\">service thread " + (n + 1);
|
||||
else
|
||||
s += "<tr><td> </td><td class=\"dl\">service thread " + (n + 1);
|
||||
s += "</td><td>" +
|
||||
"<span class=n>fds:</span> <span class=v>" + san(jso.i.contexts[ci].pt[n].fds_count) + " / " +
|
||||
san(jso.i.contexts[ci].pt_fd_max) + "</span>, ";
|
||||
s = s + "<span class=n>ah pool:</span> <span class=v>" + san(jso.i.contexts[ci].pt[n].ah_pool_inuse) + " / " +
|
||||
san(jso.i.contexts[ci].ah_pool_max) + "</span>, " +
|
||||
"<span class=n>ah waiting list:</span> <span class=v>" + san(jso.i.contexts[ci].pt[n].ah_wait_list);
|
||||
|
||||
s = s + "</span></td></tr>";
|
||||
|
||||
}
|
||||
for (n = 0; n < jso.i.contexts[ci].vhosts.length; n++) {
|
||||
if (parseInt(jso.i.contexts[ci].deprecated) == 0)
|
||||
s += "<tr><td> </td><td class=\"l\">vhost " + (n + 1);
|
||||
else
|
||||
s += "<tr><td> </td><td class=\"dl\">vhost " + (n + 1);
|
||||
s += "</td><td><span class=\"mountname\">";
|
||||
if (jso.i.contexts[ci].vhosts[n].use_ssl == '1')
|
||||
s = s + "https://";
|
||||
else
|
||||
s = s + "http://";
|
||||
s = s + san(jso.i.contexts[ci].vhosts[n].name) + ":" +
|
||||
san(jso.i.contexts[ci].vhosts[n].port) + "</span>";
|
||||
if (jso.i.contexts[ci].vhosts[n].sts == '1')
|
||||
s = s + " (STS)";
|
||||
s = s +"<br>" +
|
||||
|
||||
"<span class=n>Total Rx:</span> <span class=v>" + humanize(san(jso.i.contexts[ci].vhosts[n].rx)) +"</span>, " +
|
||||
"<span class=n>Total Tx:</span> <span class=v>" + humanize(san(jso.i.contexts[ci].vhosts[n].tx)) +"</span><br>" +
|
||||
|
||||
"<span class=n>CONNECTIONS: HTTP/1.x:</span> <span class=v>" + san(jso.i.contexts[ci].vhosts[n].h1_conn) +"</span>, " +
|
||||
"<span class=n>Websocket:</span> <span class=v>" + san(jso.i.contexts[ci].vhosts[n].ws_upg) +"</span>, " +
|
||||
"<span class=n>H2 upgrade:</span> <span class=v>" + san(jso.i.contexts[ci].vhosts[n].h2_upg) +"</span>, " +
|
||||
"<span class=n>H2 ALPN:</span> <span class=v>" + san(jso.i.contexts[ci].vhosts[n].h2_alpn) +"</span>, " +
|
||||
"<span class=n>Rejected:</span> <span class=v>" + san(jso.i.contexts[ci].vhosts[n].rejected) +"</span><br>" +
|
||||
|
||||
"<span class=n>TRANSACTIONS: HTTP/1.x:</span> <span class=v>" + san(jso.i.contexts[ci].vhosts[n].h1_trans) + "</span>, " +
|
||||
"<span class=n>H2:</span> <span class=v>" + san(jso.i.contexts[ci].vhosts[n].h2_trans) +"</span>, " +
|
||||
"<span class=n>Total H2 substreams:</span> <span class=v>" + san(jso.i.contexts[ci].vhosts[n].h2_subs) +"</span><br>" +
|
||||
|
||||
"<table style=\"margin-left:16px\"><tr><td class=t>Mountpoint</td><td class=t>Origin</td><td class=t>Cache Policy</td></tr>";
|
||||
|
||||
var m;
|
||||
for (m = 0; m < jso.i.contexts[ci].vhosts[n].mounts.length; m++) {
|
||||
s = s + "<tr><td>";
|
||||
s = s + "<span class=\"m1\">" + san(jso.i.contexts[ci].vhosts[n].mounts[m].mountpoint) +
|
||||
"</span></td><td><span class=\"m2\">" +
|
||||
san(jso.i.contexts[ci].vhosts[n].mounts[m].origin) +
|
||||
"</span></td><td>";
|
||||
if (parseInt(san(jso.i.contexts[ci].vhosts[n].mounts[m].cache_max_age)))
|
||||
s = s + "<span class=n>max-age:</span> <span class=v>" +
|
||||
san(jso.i.contexts[ci].vhosts[n].mounts[m].cache_max_age) +
|
||||
"</span>, <span class=n>reuse:</span> <span class=v>" +
|
||||
san(jso.i.contexts[ci].vhosts[n].mounts[m].cache_reuse) +
|
||||
"</span>, <span class=n>reval:</span> <span class=v>" +
|
||||
san(jso.i.contexts[ci].vhosts[n].mounts[m].cache_revalidate) +
|
||||
"</span>, <span class=n>inter:</span> <span class=v>" +
|
||||
san(jso.i.contexts[ci].vhosts[n].mounts[m].cache_intermediaries);
|
||||
s = s + "</span></td></tr>"
|
||||
}
|
||||
s = s + "</table>";
|
||||
s = s + "</td></tr>";
|
||||
}
|
||||
|
||||
s += "</table></td></tr>";
|
||||
|
||||
} // context
|
||||
s = s + "</table>";
|
||||
|
||||
document.getElementById("conninfo").innerHTML = s;
|
||||
}
|
||||
|
||||
socket_status.onclose = function(){
|
||||
document.getElementById("title").innerHTML = "Server Status (Disconnected)";
|
||||
lws_gray_out(true,{'zindex':'499'});
|
||||
}
|
||||
} catch(exception) {
|
||||
alert('<p>Error' + exception);
|
||||
}
|
||||
}
|
||||
|
||||
/* stuff that has to be delayed until all the page assets are loaded */
|
||||
|
||||
window.addEventListener("load", function() {
|
||||
|
||||
lws_gray_out(true,{'zindex':'499'});
|
||||
|
||||
ws_open_server_status();
|
||||
|
||||
}, false);
|
||||
|
||||
})();
|
||||
190
test-apps/test.css
Normal file
190
test-apps/test.css
Normal file
|
|
@ -0,0 +1,190 @@
|
|||
|
||||
span.title {
|
||||
font-size:18pt;
|
||||
font-family: Arial;
|
||||
font-weight:normal;
|
||||
text-align:center;
|
||||
color:#000000;
|
||||
}
|
||||
span.mount {
|
||||
font-size:10pt;
|
||||
font-family: Arial;
|
||||
font-weight:normal;
|
||||
text-align:center;
|
||||
color:#000000;
|
||||
}
|
||||
span.mountname {
|
||||
font-size:14pt;
|
||||
font-family: Arial;
|
||||
font-weight:bold;
|
||||
text-align:center;
|
||||
color:#404010;
|
||||
}
|
||||
span.n {
|
||||
font-size:12pt;
|
||||
font-family: Arial;
|
||||
font-weight:normal;
|
||||
text-align:center;
|
||||
color:#808020;
|
||||
}
|
||||
span.v {
|
||||
font-size:12pt;
|
||||
font-family: Arial;
|
||||
font-weight:bold;
|
||||
text-align:center;
|
||||
color:#202020;
|
||||
}
|
||||
span.m1 {
|
||||
font-size:12pt;
|
||||
font-family: Arial;
|
||||
font-weight:bold;
|
||||
text-align:center;
|
||||
color:#202020;
|
||||
}
|
||||
span.m2 {
|
||||
font-size:12pt;
|
||||
font-family: Arial;
|
||||
font-weight:normal;
|
||||
text-align:center;
|
||||
color:#202020;
|
||||
}
|
||||
|
||||
.browser { font-size:12pt; font-family: Arial; font-weight:normal; text-align:center; color:#ffff00; vertical-align:middle; text-align:center; background:#d0b070; padding:12px; -webkit-border-radius:10px; border-radius:10px;}
|
||||
.group2 { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#f0f0e0;
|
||||
padding:12px;
|
||||
-webkit-border-radius:10px;
|
||||
border-radius:10px; }
|
||||
.explain { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#f0f0c0; padding:12px;
|
||||
-webkit-border-radius:10px;
|
||||
border-radius:10px;
|
||||
color:#404000;
|
||||
padding:3px;
|
||||
}
|
||||
td.wsstatus { vertical-align:middle; width:200px; height:50px;
|
||||
text-align:center;
|
||||
background:#f0f0c0; padding:6px;
|
||||
-webkit-border-radius:8px;
|
||||
border-radius:8px;
|
||||
color:#404000; }
|
||||
.tdform { vertical-align:middle; width:200px; height:50px;
|
||||
text-align:center;
|
||||
background:#f0f0d0; padding:6px;
|
||||
-webkit-border-radius:8px;
|
||||
margin:10px;
|
||||
border-radius:8px;
|
||||
border: 1px solid black;
|
||||
border-collapse: collapse;font-size:18pt; font-family: Arial; font-weight:normal; text-align:center; color:#000000;
|
||||
color:#404000; }
|
||||
|
||||
td.l { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#d0d0b0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
|
||||
td.bigger { font-size:120%; }
|
||||
|
||||
div.bgw { background:white }
|
||||
div.conninfo {
|
||||
border: solid 2px #e0d040;
|
||||
padding: 4px;
|
||||
width: 500px;
|
||||
height:350px;
|
||||
overflow: auto;
|
||||
}
|
||||
span.f12 { font-size:12pt }
|
||||
|
||||
.content { vertical-align:top; text-align:center; background:#fffff0; padding:12px; -webkit-border-radius:10px; border-radius:10px; }
|
||||
.canvas { vertical-align:top; text-align:center; background:#efefd0; padding:12px; -webkit-border-radius:10px; border-radius:10px; }
|
||||
.tabs {
|
||||
position: relative;
|
||||
min-height: 750px; /* This part sucks */
|
||||
clear: both;
|
||||
margin: 25px 0;
|
||||
}
|
||||
.tab {
|
||||
float: left;
|
||||
}
|
||||
.tab label {
|
||||
background: #eee;
|
||||
padding: 10px;
|
||||
border: 1px solid #ccc;
|
||||
margin-left: -1px;
|
||||
position: relative;
|
||||
left: 1px;
|
||||
}
|
||||
.tab [type=radio] {
|
||||
display: none;
|
||||
}
|
||||
.content {
|
||||
position: absolute;
|
||||
top: 28px;
|
||||
left: 0;
|
||||
background: white;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
padding: 20px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
[type=radio]:checked ~ label {
|
||||
background: white;
|
||||
border-bottom: 1px solid white;
|
||||
z-index: 2;
|
||||
}
|
||||
[type=radio]:checked ~ label ~ .content {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
td.wsstatus { vertical-align:middle; width:200px; height:50px;
|
||||
text-align:center;
|
||||
background:#f0f0c0; padding:6px;
|
||||
-webkit-border-radius:8px;
|
||||
border-radius:8px;
|
||||
color:#404000; }
|
||||
td.l { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#d0d0b0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
td.dl { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#c0c0c0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
td.c { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#c0c0a0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
td.c0 { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#b0b090;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
td.dc0 { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#a0a0a0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
td.c1 { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#c0c0c0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
td.t { vertical-align:middle;
|
||||
text-align:center;
|
||||
background:#e0e0c0;
|
||||
padding:3px;
|
||||
-webkit-border-radius:3px;
|
||||
border-radius:3px; }
|
||||
File diff suppressed because one or more lines are too long
540
test-apps/test.js
Normal file
540
test-apps/test.js
Normal file
File diff suppressed because one or more lines are too long
Loading…
Add table
Reference in a new issue