Добавлена конфигурация мониторинга Nginx и финальные правки для app1
This commit is contained in:
Freazzzing
@ -6,10 +6,12 @@ server {
|
||||
root /var/www/app1;
|
||||
index index.html;
|
||||
|
||||
# Main page
|
||||
location / {
|
||||
try_files $uri $uri/ =404;
|
||||
}
|
||||
|
||||
# Nginx status for monitoring
|
||||
location /status {
|
||||
stub_status on;
|
||||
access_log off;
|
||||
@ -18,6 +20,7 @@ server {
|
||||
deny all;
|
||||
}
|
||||
|
||||
# Alternative status endpoint
|
||||
location /nginx_status {
|
||||
stub_status on;
|
||||
access_log off;
|
||||
@ -25,4 +28,45 @@ server {
|
||||
allow 192.168.0.0/24;
|
||||
deny all;
|
||||
}
|
||||
|
||||
# Test endpoints for load generation
|
||||
location /api/test {
|
||||
add_header Content-Type application/json;
|
||||
add_header Cache-Control "no-cache";
|
||||
return 200 '{"status": "ok", "timestamp": "$time_iso8601", "server": "app1", "request_id": "$request_id", "method": "$request_method"}';
|
||||
}
|
||||
|
||||
location /api/slow {
|
||||
add_header Content-Type application/json;
|
||||
add_header Cache-Control "no-cache";
|
||||
# Simple JSON response
|
||||
return 200 '{"status": "slow_endpoint", "message": "Endpoint for testing", "timestamp": "$time_iso8601"}';
|
||||
}
|
||||
|
||||
location /api/error {
|
||||
add_header Content-Type application/json;
|
||||
add_header Cache-Control "no-cache";
|
||||
# Simple error endpoint
|
||||
return 500 '{"status": "error", "code": 500, "message": "Test error response", "request_id": "$request_id"}';
|
||||
}
|
||||
|
||||
location /api/random {
|
||||
add_header Content-Type application/json;
|
||||
add_header Cache-Control "no-cache";
|
||||
# Random response - always success but different messages
|
||||
return 200 '{"status": "random", "timestamp": "$time_iso8601", "value": "$msec", "message": "Random endpoint response"}';
|
||||
}
|
||||
|
||||
location /api/metrics {
|
||||
add_header Content-Type application/json;
|
||||
add_header Cache-Control "no-cache";
|
||||
return 200 '{"server": "app1", "timestamp": "$time_iso8601", "available_endpoints": ["/api/test", "/api/slow", "/api/error", "/api/random", "/api/metrics", "/health", "/status"]}';
|
||||
}
|
||||
|
||||
# Health check endpoint
|
||||
location /health {
|
||||
add_header Content-Type application/json;
|
||||
access_log off;
|
||||
return 200 '{"status": "healthy", "service": "nginx", "timestamp": "$time_iso8601", "version": "$nginx_version"}';
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,7 +1,8 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Test App1 - Nginx</title>
|
||||
<title>Test App1 - Nginx Load Test</title>
|
||||
<meta charset="UTF-8">
|
||||
<style>
|
||||
body {
|
||||
font-family: Arial, sans-serif;
|
||||
@ -10,55 +11,297 @@
|
||||
color: #333;
|
||||
}
|
||||
.container {
|
||||
max-width: 800px;
|
||||
max-width: 1000px;
|
||||
margin: 0 auto;
|
||||
padding: 20px;
|
||||
background-color: white;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 0 10px rgba(0,0,0,0.1);
|
||||
}
|
||||
h1 {
|
||||
color: #2c3e50;
|
||||
}
|
||||
.info {
|
||||
h1 { color: #2c3e50; border-left: 5px solid #3498db; padding-left: 15px; }
|
||||
.panel {
|
||||
background-color: #e8f4fc;
|
||||
padding: 15px;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
margin: 20px 0;
|
||||
border-left: 4px solid #3498db;
|
||||
margin: 20px 0;
|
||||
}
|
||||
.metrics {
|
||||
.metrics-panel {
|
||||
background-color: #e8f8ef;
|
||||
padding: 15px;
|
||||
border-left: 4px solid #2ecc71;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
margin: 20px 0;
|
||||
border-left: 4px solid #2ecc71;
|
||||
}
|
||||
.load-panel {
|
||||
background-color: #fff3cd;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
margin: 20px 0;
|
||||
border-left: 4px solid #f39c12;
|
||||
}
|
||||
button {
|
||||
padding: 10px 20px;
|
||||
margin: 5px;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.btn-primary { background-color: #3498db; color: white; }
|
||||
.btn-success { background-color: #2ecc71; color: white; }
|
||||
.btn-warning { background-color: #f39c12; color: white; }
|
||||
.btn-danger { background-color: #e74c3c; color: white; }
|
||||
.stats { display: flex; gap: 20px; margin-top: 20px; }
|
||||
.stat-box {
|
||||
flex: 1;
|
||||
padding: 15px;
|
||||
background: white;
|
||||
border-radius: 5px;
|
||||
text-align: center;
|
||||
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
|
||||
}
|
||||
#log {
|
||||
background: #f8f9fa;
|
||||
padding: 15px;
|
||||
border-radius: 5px;
|
||||
height: 200px;
|
||||
overflow-y: auto;
|
||||
font-family: monospace;
|
||||
font-size: 12px;
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
.status-icon::before {
|
||||
content: "✓";
|
||||
color: green;
|
||||
font-weight: bold;
|
||||
margin-right: 5px;
|
||||
}
|
||||
.error-icon::before {
|
||||
content: "✗";
|
||||
color: red;
|
||||
font-weight: bold;
|
||||
margin-right: 5px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>🚀 Test Application 1 - Nginx Server</h1>
|
||||
<h1>Test Application 1 - Nginx Load Testing</h1>
|
||||
|
||||
<div class="info">
|
||||
<h3>📊 Server Information:</h3>
|
||||
<div class="panel">
|
||||
<h3>Server Information</h3>
|
||||
<p><strong>Hostname:</strong> {{ ansible_hostname }}</p>
|
||||
<p><strong>IP Address:</strong> {{ ansible_default_ipv4.address }}</p>
|
||||
<p><strong>Role:</strong> Web Server (Nginx)</p>
|
||||
<p><strong>Deployed via:</strong> Ansible</p>
|
||||
<p><strong>Deployed:</strong> {{ ansible_date_time.date }}</p>
|
||||
</div>
|
||||
|
||||
<div class="metrics">
|
||||
<h3>📈 Monitoring:</h3>
|
||||
<p>Node Exporter metrics available at: <code>http://{{ ansible_default_ipv4.address }}:9100/metrics</code></p>
|
||||
<p>Nginx stub_status at: <code>http://{{ ansible_default_ipv4.address }}/status</code></p>
|
||||
<p>Collected by Prometheus: <code>192.168.0.105:9090</code></p>
|
||||
<div class="load-panel">
|
||||
<h3>Load Testing Controls</h3>
|
||||
<div>
|
||||
<button class="btn-primary" onclick="startLoadTest('light')">Light Load (1-5 req/sec)</button>
|
||||
<button class="btn-success" onclick="startLoadTest('medium')">Medium Load (10-20 req/sec)</button>
|
||||
<button class="btn-warning" onclick="startLoadTest('heavy')">Heavy Load (50-100 req/sec)</button>
|
||||
<button class="btn-danger" onclick="stopLoadTest()">Stop Load Test</button>
|
||||
</div>
|
||||
|
||||
<div style="margin-top: 20px;">
|
||||
<label>Custom Requests: </label>
|
||||
<input type="number" id="requestCount" value="100" min="1" max="10000" style="width: 80px;">
|
||||
<button class="btn-primary" onclick="sendCustomRequests()">Send Requests</button>
|
||||
<button class="btn-warning" onclick="generateTraffic()">Generate Random Traffic</button>
|
||||
</div>
|
||||
|
||||
<div class="stats">
|
||||
<div class="stat-box">
|
||||
<h4>Requests Sent</h4>
|
||||
<div id="requestsCount">0</div>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h4>Successful</h4>
|
||||
<div id="successCount">0</div>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h4>Failed</h4>
|
||||
<div id="failedCount">0</div>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h4>Active Tests</h4>
|
||||
<div id="activeTests">0</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3>🔗 Infrastructure Links:</h3>
|
||||
<ul>
|
||||
<li><a href="http://192.168.0.106:3000">Grafana Dashboard</a></li>
|
||||
<li><a href="http://192.168.0.105:9090">Prometheus UI</a></li>
|
||||
<li><a href="http://192.168.0.100:3000">Git/Forgejo</a></li>
|
||||
</ul>
|
||||
<div class="metrics-panel">
|
||||
<h3>Monitoring & Metrics</h3>
|
||||
<p>Node Exporter: <a href="http://{{ ansible_default_ipv4.address }}:9100/metrics" target="_blank">:9100/metrics</a></p>
|
||||
<p>Nginx Status: <a href="http://{{ ansible_default_ipv4.address }}/status" target="_blank">/status</a></p>
|
||||
<p>Nginx Metrics: <a href="http://{{ ansible_default_ipv4.address }}/nginx_status" target="_blank">/nginx_status</a></p>
|
||||
|
||||
<h4>API Endpoints:</h4>
|
||||
<div style="font-family: monospace; font-size: 12px; background: #f8f9fa; padding: 10px; border-radius: 5px;">
|
||||
<div><a href="/api/test" target="_blank">/api/test</a> - Test endpoint</div>
|
||||
<div><a href="/api/error" target="_blank">/api/error</a> - Error endpoint (500)</div>
|
||||
<div><a href="/api/random" target="_blank">/api/random</a> - Random response</div>
|
||||
<div><a href="/api/metrics" target="_blank">/api/metrics</a> - API info</div>
|
||||
<div><a href="/health" target="_blank">/health</a> - Health check</div>
|
||||
</div>
|
||||
|
||||
<h4>Quick Links:</h4>
|
||||
<div>
|
||||
<a href="http://192.168.0.106:3000" target="_blank">Grafana Dashboard</a> |
|
||||
<a href="http://192.168.0.105:9090" target="_blank">Prometheus UI</a> |
|
||||
<a href="http://192.168.0.100:3000" target="_blank">Git/Forgejo</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h3>Request Log</h3>
|
||||
<div id="log"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
let loadTestInterval = null;
|
||||
let activeTests = 0;
|
||||
let requestsSent = 0;
|
||||
let successCount = 0;
|
||||
let failedCount = 0;
|
||||
|
||||
function logMessage(message, type = 'info') {
|
||||
const logDiv = document.getElementById('log');
|
||||
const timestamp = new Date().toLocaleTimeString();
|
||||
const icon = type === 'error' ? '<span class="error-icon"></span>' :
|
||||
type === 'success' ? '<span class="status-icon"></span>' : '>';
|
||||
const color = type === 'error' ? 'red' : type === 'success' ? 'green' : '#666';
|
||||
logDiv.innerHTML = `<div style="color: ${color}; margin: 2px 0;">${icon} [${timestamp}] ${message}</div>` + logDiv.innerHTML;
|
||||
}
|
||||
|
||||
function updateStats() {
|
||||
document.getElementById('requestsCount').textContent = requestsSent;
|
||||
document.getElementById('successCount').textContent = successCount;
|
||||
document.getElementById('failedCount').textContent = failedCount;
|
||||
document.getElementById('activeTests').textContent = activeTests;
|
||||
}
|
||||
|
||||
async function sendRequest(endpoint = '/') {
|
||||
requestsSent++;
|
||||
updateStats();
|
||||
|
||||
try {
|
||||
const startTime = Date.now();
|
||||
const response = await fetch(endpoint);
|
||||
const endTime = Date.now();
|
||||
const duration = endTime - startTime;
|
||||
|
||||
if (response.ok) {
|
||||
successCount++;
|
||||
logMessage(`Request ${requestsSent} to ${endpoint}: ${duration}ms (${response.status})`, 'success');
|
||||
} else {
|
||||
failedCount++;
|
||||
logMessage(`Request ${requestsSent} to ${endpoint}: Failed (${response.status})`, 'error');
|
||||
}
|
||||
} catch (error) {
|
||||
failedCount++;
|
||||
logMessage(`Request ${requestsSent} to ${endpoint}: Error - ${error.message}`, 'error');
|
||||
}
|
||||
}
|
||||
|
||||
function startLoadTest(intensity) {
|
||||
if (loadTestInterval) {
|
||||
clearInterval(loadTestInterval);
|
||||
}
|
||||
|
||||
let interval;
|
||||
let endpoints = ['/', '/api/test', '/api/random', '/health'];
|
||||
|
||||
switch(intensity) {
|
||||
case 'light':
|
||||
interval = 200; // 5 req/sec
|
||||
logMessage('Starting LIGHT load test (5 req/sec)');
|
||||
break;
|
||||
case 'medium':
|
||||
interval = 50; // 20 req/sec
|
||||
logMessage('Starting MEDIUM load test (20 req/sec)');
|
||||
break;
|
||||
case 'heavy':
|
||||
interval = 10; // 100 req/sec
|
||||
logMessage('Starting HEAVY load test (100 req/sec)');
|
||||
break;
|
||||
}
|
||||
|
||||
activeTests++;
|
||||
updateStats();
|
||||
|
||||
loadTestInterval = setInterval(() => {
|
||||
const endpoint = endpoints[Math.floor(Math.random() * endpoints.length)];
|
||||
sendRequest(endpoint);
|
||||
}, interval);
|
||||
}
|
||||
|
||||
function stopLoadTest() {
|
||||
if (loadTestInterval) {
|
||||
clearInterval(loadTestInterval);
|
||||
loadTestInterval = null;
|
||||
activeTests = Math.max(0, activeTests - 1);
|
||||
updateStats();
|
||||
logMessage('Load test stopped');
|
||||
}
|
||||
}
|
||||
|
||||
function sendCustomRequests() {
|
||||
const count = parseInt(document.getElementById('requestCount').value);
|
||||
const endpoints = ['/', '/api/test', '/api/error', '/api/random', '/health'];
|
||||
|
||||
logMessage(`Sending ${count} custom requests`);
|
||||
|
||||
activeTests++;
|
||||
updateStats();
|
||||
|
||||
let completed = 0;
|
||||
for (let i = 0; i < count; i++) {
|
||||
setTimeout(() => {
|
||||
const endpoint = endpoints[Math.floor(Math.random() * endpoints.length)];
|
||||
sendRequest(endpoint);
|
||||
completed++;
|
||||
if (completed === count) {
|
||||
activeTests--;
|
||||
updateStats();
|
||||
logMessage(`Completed ${count} custom requests`);
|
||||
}
|
||||
}, i * 10); // Stagger requests
|
||||
}
|
||||
}
|
||||
|
||||
function generateTraffic() {
|
||||
logMessage('Starting random traffic generation');
|
||||
activeTests++;
|
||||
updateStats();
|
||||
|
||||
const endpoints = ['/', '/api/test', '/api/error', '/api/random', '/health'];
|
||||
|
||||
const randomTrafficInterval = setInterval(() => {
|
||||
if (Math.random() > 0.7) { // 30% chance to send request
|
||||
const endpoint = endpoints[Math.floor(Math.random() * endpoints.length)];
|
||||
sendRequest(endpoint);
|
||||
}
|
||||
}, 100);
|
||||
|
||||
// Stop after 2 minutes
|
||||
setTimeout(() => {
|
||||
clearInterval(randomTrafficInterval);
|
||||
activeTests--;
|
||||
updateStats();
|
||||
logMessage('Random traffic generation stopped');
|
||||
}, 120000);
|
||||
}
|
||||
|
||||
// Initialize with some log messages
|
||||
logMessage('App1 Load Testing Interface Ready');
|
||||
logMessage(`Server: {{ ansible_hostname }} ({{ ansible_default_ipv4.address }})`);
|
||||
logMessage('Use buttons above to generate load for monitoring');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user