Skip to content

UsingtheWebUI.md

Jump to bottom
Chris edited this page Jun 22, 2025 · 6 revisions

Using the Web UI

DockFlare features a comprehensive web interface that provides real-time visibility and interactive control over your tunnels and services. It is styled with the modern, themeable DaisyUI component library.

Access: How to Access the Web UI (Typically http://localhost:5000)

Web UI example *Note: This screenshot is from an older version. The current UI has been significantly updated.

The UI is organized into several key sections:

1. Status Dashboard & Controls

This top section provides an at-a-glance overview of DockFlare's core components.

  • Tunnel Status: Shows the state of the Cloudflare Tunnel connection, including its Name and ID.
  • Agent Status (Managed Mode): Displays the live status of the managed cloudflared agent container (e.g., "running", "stopped") and provides Start/Stop buttons.
  • Rule Count: Shows the total number of ingress rules currently managed by DockFlare.
  • Last Action: A dynamic message area displaying the outcome of the most recent operation.
  • Theme Selector: A dropdown at the top-right to customize the UI's appearance. Your choice is saved in your browser.

2. Managed Ingress Rules

This is the main table, listing all rules managed by DockFlare from both Docker labels and manual entries.

  • Add Manual Rule Button: A prominent button above the table that opens a modal to create rules for non-Docker services.

The table columns include:

  • Status: A badge indicating if a rule is active or pending deletion.
  • Hostname & Path: The public endpoint for the service. The hostname is a clickable link. If a path is set, it's displayed here.
  • Service Target: The internal protocol://host:port that traffic is forwarded to.
  • Source: Shows whether the rule originated from a Docker container (with its short ID) or was created Manually.
  • Access Policy: Displays the current security policy (Bypass, Authenticate, etc.). A "UI Override" badge appears if the policy was set via the UI, taking precedence over container labels.
  • Manage Policy: An interactive dropdown to:
    • Edit Policy: Change the Access Policy for any rule.
    • Revert to Labels: (For Docker rules with a UI override) Removes the override and allows the container's labels to take control again.
  • Expires At (UTC): For rules pending deletion, this shows when they will be automatically removed.
  • Actions:
    • Edit: (For Manual rules only) Opens a modal to edit the rule's configuration.
    • Delete: Immediately removes the rule and its associated Cloudflare resources, bypassing the grace period.

3. All Cloudflare Tunnels on Account

This section provides a high-level view of your entire Cloudflare Tunnel infrastructure.

  • It lists all tunnels on your Cloudflare account, not just the one managed by this DockFlare instance.
  • You can see each tunnel's status, ID, and active connections.
  • Clicking the + icon next to a tunnel fetches and displays all DNS records pointing to it, which is excellent for auditing.

4. Real-time Activity Logs

  • A terminal-styled log viewer streams DockFlare's activity directly to your browser in real-time.
  • It shows container events, label processing, Cloudflare API calls, and any errors, making it essential for monitoring and debugging. See also: Debugging & Logs.

Note on Reverse Proxies: If you access the UI through a reverse proxy, ensure it is configured to handle Server-Sent Events (SSE) without buffering. For Nginx, you might add headers like X-Accel-Buffering: no; and Cache-Control: no-cache; for the /stream-logs location.

Clone this wiki locally