Setting Up the Web Dashboard

Bifröst comes with an optional web dashboard. Users log in with Discord and Fluxer and can then link servers and channels from their browser instead of using text commands. If you’ve set BF_DISCORD_OWNER_ID or BF_FLUXER_OWNER_ID, the owner also gets an admin page with bot stats.

The dashboard is disabled by default. This guide assumes you already have Bifröst running using one of the self-hosting guides.

How it works

• The dashboard is served by Bifröst itself, on port 9092 by default.
• Users log in via OAuth2 using the same Discord and Fluxer applications your bot already uses. You don’t need to create new applications.
• Users only see servers where they have the Manage Server permission. Managing channel links requires Manage Webhooks on at least one of the two linked servers.
• Sessions are stored in Bifröst’s database, so users stay logged in across restarts.

1. Choose the public URL

Decide which URL the dashboard will be reached at, for example https://bifrost.example.com. Bifröst builds the OAuth2 redirect URIs from this URL, and it has to match exactly what you register with Discord and Fluxer.

The redirect URIs are:

• Discord: <PUBLIC_URL>/api/auth/discord/callback
• Fluxer: <PUBLIC_URL>/api/auth/fluxer/callback

If you only want to use the dashboard on the machine Bifröst runs on, you can use http://localhost:9092.

2. Configure the Discord application

1. Open the Discord Developer Portal:
   https://discord.com/developers/applications
2. Select your Bifröst application and go to OAuth2.
3. Under Redirects, add https://bifrost.example.com/api/auth/discord/callback (with your own public URL).
4. Click Reset Secret under Client Secret and copy it. This is your BF_DISCORD_CLIENT_SECRET.
5. Save your changes.

3. Configure the Fluxer application

1. Open Fluxer and go to User Settings → Applications.
2. Select your Bifröst application.
3. Add https://bifrost.example.com/api/auth/fluxer/callback (with your own public URL) as a redirect URI.
4. Copy the Client Secret. This is your BF_FLUXER_CLIENT_SECRET.

4. Generate a session secret

The session secret signs users’ login cookies. Generate a random one:

openssl rand -base64 32

Keep it private. Changing it later logs out all users.

5. Update your .env file

Add the following to your .env file:

BF_ENABLE_WEB_DASHBOARD="true"
BF_WEB_PUBLIC_URL="https://bifrost.example.com"
BF_SESSION_SECRET="Your generated session secret"

BF_DISCORD_CLIENT_SECRET="Your Discord client secret"
BF_FLUXER_CLIENT_SECRET="Your Fluxer client secret"

Optionally, set BF_WEB_PORT to run the dashboard on a port other than 9092.

Bifröst won’t start the dashboard without BF_SESSION_SECRET.

6. Expose the port

Docker

Uncomment (or add) the ports section in your docker-compose.yml:

services:
    bifrost:
        image: kartoffelchipss/bifrost:latest
        container_name: bifrost
        restart: unless-stopped
        ports:
            - '9092:9092'
        env_file:
            - .env
        volumes:
            - ./config:/config

If you put a reverse proxy in front of Bifröst on the same host, bind the port to localhost only so it isn’t reachable directly: '127.0.0.1:9092:9092'.

Then recreate the container:

docker compose up -d

Manual setup

The Docker image builds the dashboard and sets NODE_ENV=production for you. Without Docker, you need to do both yourself, otherwise only the API is served and the dashboard page won’t load:

pnpm install
pnpm --dir dashboard build
NODE_ENV=production pnpm start

On Windows (PowerShell), set the variable with $env:NODE_ENV="production" before running pnpm start.

7. Set up a reverse proxy (recommended)

To serve the dashboard over HTTPS on a domain, put a reverse proxy in front of it. By default Bifröst trusts one proxy hop, which is what you need when a single reverse proxy forwards requests to it. If your setup differs, adjust BF_WEB_TRUST_PROXY. See the Environment Variables reference.

Caddy:

bifrost.example.com {
    reverse_proxy localhost:9092
}

nginx:

server {
    listen 443 ssl;
    server_name bifrost.example.com;

    # ssl_certificate ...;
    # ssl_certificate_key ...;

    location / {
        proxy_pass http://127.0.0.1:9092;
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
}

Forwarding X-Forwarded-Proto matters: Bifröst uses it to decide whether the session cookie is marked secure.

8. Log in

Open your public URL in a browser. You should see Web dashboard listening on port 9092 in Bifröst’s logs. Log in with both Discord and Fluxer to see the servers you can manage and link them.

Troubleshooting

• “Invalid redirect URI” / “redirect_uri mismatch”: The redirect URI registered with Discord or Fluxer doesn’t exactly match BF_WEB_PUBLIC_URL plus the callback path. Check for typos, http vs. https, and trailing slashes.
• Login works but you’re immediately logged out: Usually a cookie problem behind a reverse proxy. Make sure the proxy forwards X-Forwarded-Proto and that BF_WEB_TRUST_PROXY matches your setup.
• The page shows “Bifröst dashboard API is running”: NODE_ENV isn’t set to production, or the dashboard wasn’t built. See the manual setup step.
• A server doesn’t show up: You need the Manage Server permission on it. The server list is fetched when you log in, so log out and back in after your permissions change or you join a new server.

Full reference

See the Environment Variables reference for all dashboard options.