87 lines
2.8 KiB
HTML
87 lines
2.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta name="zoraxy.csrf.Token" content="{{.csrfToken}}">
|
|
<title>Firewall</title>
|
|
<link rel="stylesheet" href="./style.css">
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<h1>Firewall</h1>
|
|
<p>Inline WAF proxy with health checks and fail-open bypass.</p>
|
|
</header>
|
|
|
|
<main>
|
|
<section class="config-panel">
|
|
<h2>Configuration</h2>
|
|
|
|
<div class="field">
|
|
<label class="toggle">
|
|
<input type="checkbox" id="fw-enabled">
|
|
<span class="slider"></span>
|
|
</label>
|
|
<span id="enabled-label">Firewall Disabled</span>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label for="waf-url">WAF URL</label>
|
|
<input type="text" id="waf-url" placeholder="http://127.0.0.1:8080">
|
|
<small>The firewall application URL (e.g. Wallarm, ModSecurity, Coraza).</small>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label for="return-port">Return Port</label>
|
|
<input type="number" id="return-port" placeholder="8080" min="1" max="65535">
|
|
<small>Traffic returns to Zoraxy on this port for routing to the backend.</small>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label for="health-interval">Health Check Interval (s)</label>
|
|
<input type="number" id="health-interval" placeholder="5" min="1" max="60">
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label for="timeout-ms">Proxy Timeout (ms)</label>
|
|
<input type="number" id="timeout-ms" placeholder="10000" min="100" max="30000">
|
|
</div>
|
|
|
|
<button id="save-btn" class="btn btn-primary">Save Configuration</button>
|
|
<span id="save-status"></span>
|
|
</section>
|
|
|
|
<section class="stats-panel">
|
|
<h2>Status</h2>
|
|
<div class="stat-row">
|
|
<span class="stat-label">Circuit Breaker:</span>
|
|
<span id="circuit-state" class="stat-value">--</span>
|
|
</div>
|
|
<div class="stat-row">
|
|
<span class="stat-label">Status:</span>
|
|
<span id="fw-status" class="stat-value">--</span>
|
|
</div>
|
|
<div class="stat-row">
|
|
<span class="stat-label">Total Inspected:</span>
|
|
<span id="stat-total" class="stat-value">0</span>
|
|
</div>
|
|
<div class="stat-row">
|
|
<span class="stat-label">Allowed:</span>
|
|
<span id="stat-allowed" class="stat-value ok">0</span>
|
|
</div>
|
|
<div class="stat-row">
|
|
<span class="stat-label">Blocked:</span>
|
|
<span id="stat-blocked" class="stat-value warn">0</span>
|
|
</div>
|
|
<div class="stat-row">
|
|
<span class="stat-label">Bypassed (fail-open):</span>
|
|
<span id="stat-bypassed" class="stat-value">0</span>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<script src="/script/jquery-3.6.0.min.js"></script>
|
|
<script src="/script/utils.js"></script>
|
|
<script src="./app.js"></script>
|
|
</body>
|
|
</html>
|