| <!DOCTYPE html> |
| <html lang="en" class="dark"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>LogFlow API Documentation</title> |
| <script src="https://cdn.tailwindcss.com"></script> |
| <script src="https://unpkg.com/feather-icons"></script> |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> |
| <script> |
| tailwind.config = { |
| darkMode: 'class', |
| theme: { |
| extend: { |
| colors: { |
| primary: '#3b82f6', |
| secondary: '#6366f1', |
| } |
| } |
| } |
| } |
| </script> |
| <style> |
| @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap'); |
| body { |
| font-family: 'Inter', sans-serif; |
| } |
| .method-get { |
| background-color: rgba(74, 222, 128, 0.1); |
| color: #4ade80; |
| } |
| .method-post { |
| background-color: rgba(96, 165, 250, 0.1); |
| color: #3b82f6; |
| } |
| .method-put { |
| background-color: rgba(250, 204, 21, 0.1); |
| color: #facc15; |
| } |
| .method-delete { |
| background-color: rgba(248, 113, 113, 0.1); |
| color: #f87171; |
| } |
| code { |
| background-color: rgba(55, 65, 81, 0.5); |
| padding: 0.2rem 0.4rem; |
| border-radius: 0.25rem; |
| font-family: 'Courier New', monospace; |
| } |
| pre { |
| background-color: rgba(55, 65, 81, 0.5); |
| padding: 1rem; |
| border-radius: 0.5rem; |
| overflow-x: auto; |
| } |
| </style> |
| </head> |
| <body class="bg-gray-900 text-gray-200 min-h-screen"> |
| <div class="container mx-auto px-6 py-12"> |
| <div class="flex items-center space-x-2 mb-12"> |
| <i data-feather="activity" class="text-primary w-8 h-8"></i> |
| <span class="text-3xl font-bold bg-gradient-to-r from-primary to-secondary bg-clip-text text-transparent">LogFlow API</span> |
| </div> |
|
|
| <div class="grid grid-cols-1 lg:grid-cols-4 gap-8"> |
| |
| <div class="lg:col-span-1"> |
| <div class="bg-gray-800 rounded-xl p-6 sticky top-6"> |
| <h3 class="text-lg font-semibold mb-4">API Endpoints</h3> |
| <ul class="space-y-2"> |
| <li><a href="#authentication" class="block px-3 py-2 rounded-md hover:bg-gray-700 transition">Authentication</a></li> |
| <li><a href="#logs" class="block px-3 py-2 rounded-md hover:bg-gray-700 transition">Log Management</a></li> |
| <li><a href="#sources" class="block px-3 py-2 rounded-md hover:bg-gray-700 transition">Log Sources</a></li> |
| <li><a href="#alerts" class="block px-3 py-2 rounded-md hover:bg-gray-700 transition">Alerts</a></li> |
| <li><a href="#stats" class="block px-3 py-2 rounded-md hover:bg-gray-700 transition">Statistics</a></li> |
| </ul> |
| |
| <h3 class="text-lg font-semibold mt-8 mb-4">Quick Start</h3> |
| <div class="bg-gray-900 p-4 rounded-lg"> |
| <p class="text-sm text-gray-400 mb-2">Install with curl:</p> |
| <pre class="text-sm">curl -X POST https://api.logflow.io/v1/install</pre> |
| </div> |
| </div> |
| </div> |
|
|
| |
| <div class="lg:col-span-3 space-y-12"> |
| |
| <section id="authentication"> |
| <h2 class="text-2xl font-bold mb-6">Authentication</h2> |
| <p class="text-gray-400 mb-6">All API requests require authentication using an API key. Include your key in the <code>Authorization</code> header.</p> |
| |
| <div class="bg-gray-800 rounded-xl overflow-hidden border border-gray-700 mb-8"> |
| <div class="px-6 py-4 border-b border-gray-700 flex items-center"> |
| <span class="method-get px-3 py-1 rounded-full text-xs font-bold mr-3">GET</span> |
| <span class="font-mono">/v1/auth/verify</span> |
| </div> |
| <div class="p-6"> |
| <p class="text-gray-400 mb-4">Verify your API key is valid.</p> |
| <h4 class="font-semibold mb-2">Example Request</h4> |
| <pre class="mb-4">curl -X GET https://api.logflow.io/v1/auth/verify \ |
| -H "Authorization: Bearer YOUR_API_KEY"</pre> |
| <h4 class="font-semibold mb-2">Response</h4> |
| <pre>{ |
| "valid": true, |
| "expires_at": "2023-12-31T23:59:59Z" |
| }</pre> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="logs"> |
| <h2 class="text-2xl font-bold mb-6">Log Management</h2> |
| |
| <div class="bg-gray-800 rounded-xl overflow-hidden border border-gray-700 mb-8"> |
| <div class="px-6 py-4 border-b border-gray-700 flex items-center"> |
| <span class="method-post px-3 py-1 rounded-full text-xs font-bold mr-3">POST</span> |
| <span class="font-mono">/v1/logs</span> |
| </div> |
| <div class="p-6"> |
| <p class="text-gray-400 mb-4">Ingest new log entries into the system.</p> |
| <h4 class="font-semibold mb-2">Request Body</h4> |
| <pre class="mb-4">{ |
| "source": "web-server-1", |
| "level": "error", |
| "message": "Database connection failed", |
| "timestamp": "2023-06-15T14:30:00Z", |
| "metadata": { |
| "service": "auth-service", |
| "ip": "192.168.1.1" |
| } |
| }</pre> |
| <h4 class="font-semibold mb-2">Example Request</h4> |
| <pre class="mb-4">curl -X POST https://api.logflow.io/v1/logs \ |
| -H "Authorization: Bearer YOUR_API_KEY" \ |
| -H "Content-Type: application/json" \ |
| -d '{"source":"web-server-1","level":"error","message":"Database connection failed"}'</pre> |
| <h4 class="font-semibold mb-2">Response</h4> |
| <pre>{ |
| "id": "log_123456789", |
| "status": "processed" |
| }</pre> |
| </div> |
| </div> |
|
|
| <div class="bg-gray-800 rounded-xl overflow-hidden border border-gray-700 mb-8"> |
| <div class="px-6 py-4 border-b border-gray-700 flex items-center"> |
| <span class="method-get px-3 py-1 rounded-full text-xs font-bold mr-3">GET</span> |
| <span class="font-mono">/v1/logs</span> |
| </div> |
| <div class="p-6"> |
| <p class="text-gray-400 mb-4">Query logs with filters and pagination.</p> |
| <h4 class="font-semibold mb-2">Query Parameters</h4> |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4"> |
| <div> |
| <p><code>level</code> <span class="text-gray-500">string</span></p> |
| <p class="text-sm text-gray-400">Filter by log level (error, warning, info)</p> |
| </div> |
| <div> |
| <p><code>source</code> <span class="text-gray-500">string</span></p> |
| <p class="text-sm text-gray-400">Filter by source identifier</p> |
| </div> |
| <div> |
| <p><code>limit</code> <span class="text-gray-500">integer</span></p> |
| <p class="text-sm text-gray-400">Number of results per page (default: 50)</p> |
| </div> |
| <div> |
| <p><code>page</code> <span class="text-gray-500">integer</span></p> |
| <p class="text-sm text-gray-400">Page number (default: 1)</p> |
| </div> |
| </div> |
| <h4 class="font-semibold mb-2">Example Request</h4> |
| <pre class="mb-4">curl -X GET "https://api.logflow.io/v1/logs?level=error&limit=10" \ |
| -H "Authorization: Bearer YOUR_API_KEY"</pre> |
| <h4 class="font-semibold mb-2">Response</h4> |
| <pre>{ |
| "data": [ |
| { |
| "id": "log_123456789", |
| "source": "web-server-1", |
| "level": "error", |
| "message": "Database connection failed", |
| "timestamp": "2023-06-15T14:30:00Z", |
| "metadata": { |
| "service": "auth-service" |
| } |
| } |
| ], |
| "total": 1245, |
| "page": 1, |
| "pages": 125 |
| }</pre> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="sources"> |
| <h2 class="text-2xl font-bold mb-6">Log Sources</h2> |
| |
| <div class="bg-gray-800 rounded-xl overflow-hidden border border-gray-700 mb-8"> |
| <div class="px-6 py-4 border-b border-gray-700 flex items-center"> |
| <span class="method-get px-3 py-1 rounded-full text-xs font-bold mr-3">GET</span> |
| <span class="font-mono">/v1/sources</span> |
| </div> |
| <div class="p-6"> |
| <p class="text-gray-400 mb-4">List all configured log sources.</p> |
| <h4 class="font-semibold mb-2">Example Request</h4> |
| <pre class="mb-4">curl -X GET https://api.logflow.io/v1/sources \ |
| -H "Authorization: Bearer YOUR_API_KEY"</pre> |
| <h4 class="font-semibold mb-2">Response</h4> |
| <pre>{ |
| "sources": [ |
| { |
| "id": "src_123456789", |
| "name": "web-server-1", |
| "type": "file", |
| "path": "/var/log/nginx/access.log", |
| "status": "active", |
| "last_activity": "2023-06-15T14:32:00Z" |
| } |
| ] |
| }</pre> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="alerts"> |
| <h2 class="text-2xl font-bold mb-6">Alerts</h2> |
| |
| <div class="bg-gray-800 rounded-xl overflow-hidden border border-gray-700 mb-8"> |
| <div class="px-6 py-4 border-b border-gray-700 flex items-center"> |
| <span class="method-post px-3 py-1 rounded-full text-xs font-bold mr-3">POST</span> |
| <span class="font-mono">/v1/alerts</span> |
| </div> |
| <div class="p-6"> |
| <p class="text-gray-400 mb-4">Create a new alert rule.</p> |
| <h4 class="font-semibold mb-2">Request Body</h4> |
| <pre class="mb-4">{ |
| "name": "High Error Rate", |
| "condition": "error_count > 10", |
| "time_window": "5m", |
| "actions": [ |
| { |
| "type": "webhook", |
| "target": "https://hooks.slack.com/services/..." |
| } |
| ] |
| }</pre> |
| <h4 class="font-semibold mb-2">Example Request</h4> |
| <pre class="mb-4">curl -X POST https://api.logflow.io/v1/alerts \ |
| -H "Authorization: Bearer YOUR_API_KEY" \ |
| -H "Content-Type: application/json" \ |
| -d '{"name":"High Error Rate","condition":"error_count > 10"}'</pre> |
| <h4 class="font-semibold mb-2">Response</h4> |
| <pre>{ |
| "id": "alert_123456789", |
| "status": "active" |
| }</pre> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="stats"> |
| <h2 class="text-2xl font-bold mb-6">Statistics</h2> |
| |
| <div class="bg-gray-800 rounded-xl overflow-hidden border border-gray-700 mb-8"> |
| <div class="px-6 py-4 border-b border-gray-700 flex items-center"> |
| <span class="method-get px-3 py-1 rounded-full text-xs font-bold mr-3">GET</span> |
| <span class="font-mono">/v1/stats</span> |
| </div> |
| <div class="p-6"> |
| <p class="text-gray-400 mb-4">Get system statistics.</p> |
| <h4 class="font-semibold mb-2">Example Request</h4> |
| <pre class="mb-4">curl -X GET https://api.logflow.io/v1/stats \ |
| -H "Authorization: Bearer YOUR_API_KEY"</pre> |
| <h4 class="font-semibold mb-2">Response</h4> |
| <pre>{ |
| "logs": { |
| "total": 24568, |
| "errors": 1245, |
| "warnings": 876, |
| "info": 22447 |
| }, |
| "sources": { |
| "active": 19, |
| "inactive": 2 |
| }, |
| "storage": { |
| "used": "45GB", |
| "available": "155GB" |
| } |
| }</pre> |
| </div> |
| </div> |
| </section> |
| </div> |
| </div> |
| </div> |
|
|
| <script> |
| |
| feather.replace(); |
| |
| |
| document.querySelectorAll('a[href^="#"]').forEach(anchor => { |
| anchor.addEventListener('click', function (e) { |
| e.preventDefault(); |
| document.querySelector(this.getAttribute('href')).scrollIntoView({ |
| behavior: 'smooth' |
| }); |
| }); |
| }); |
| </script> |
| </body> |
| </html> |
