MediaMTX のWeb UI。
ブラウザからライブ映像を見て、録画を探し、あらゆる設定キーを編集。
🌍 30の言語で読む
🇺🇸 English • 🇪🇸 Español • 🇨🇳 中文 • 🇮🇹 Italiano • 🇩🇪 Deutsch • 🇷🇺 Русский • 🇫🇷 Français • 🇵🇹 Português • 🇯🇵 日本語 • 🇵🇱 Polski • 🇰🇷 한국어 • 🇹🇷 Türkçe • 🇳🇱 Nederlands • 🇨🇿 Čeština • 🇹🇼 繁體中文 • 🇧🇷 Português (BR) • 🇮🇩 Bahasa Indonesia • 🇷🇴 Română • 🇸🇪 Svenska • 🇩🇰 Dansk • 🇳🇴 Norsk • 🇫🇮 Suomi • 🇬🇷 Ελληνικά • 🇭🇺 Magyar • 🇺🇦 Українська • 🇻🇳 Tiếng Việt • 🇵🇭 Tagalog • 🇹🇭 ไทย • 🇮🇳 हिन्दी • 🇧🇩 বাংলা
MediaMTX は優れたストリーミングサーバーですが、UI がありません。Connect はその欠けたフロントエンドです。MediaMTX の API と会話するコンテナ1つが、カメラウォール、録画アーカイブ、設定エディタに変えてくれます。
置き換えではなく相棒です。どの画面も MediaMTX がすでに公開しているものに対応します。path、API エンドポイント、runOn* フック、ネイティブに提供するプロトコル。映像は保存せず、メディアも中継せず、データベースも持ちません。
マルチアーキテクチャのイメージ(linux/amd64、linux/arm64)——Docker が適切なものを取得します。
すでに MediaMTX が動いている場合 — その隣に Connect を追加します。
docker run -d \
-p 3000:3000 \
-e BACKEND_SERVER_MEDIAMTX_URL=http://<your-mediamtx-host> \
-v /path/to/recordings:/recordings \
-v mediamtx-connect-data:/data \
bcanfield/mediamtx-connect:latestゼロから始める場合 — 同梱の compose が両方を起動します。
git clone https://github.com/bcanfield/mediamtx-connect.git
cd mediamtx-connect
docker compose up -dあとは http://localhost:3000 を開くだけです。
Important
Connect は mediamtx.yml に api: yes が必要です。同梱の設定はそのまま動きます。
MediaMTX が把握しているすべての path を、2〜4列のグリッドで。
- カードごとに WebRTC か HLS。
AUTOは黙って HLS へ落とし、LOW-LATは WebRTC を要求し、COMPATは HLS を強制します。各カードは実際に確立できたトランスポートを表示します。 - 停止中もスナップショット。 バックグラウンドジョブが各カードに最近のフレームを保ち、その経過時間をピルに出します。
- ライブのテレメトリ。 コーデック、視聴者数、稼働時間を path 一覧からそのまま表示。
- 正直な録画状態。 カードはそのストリームが実際に録画中かを示します。Connect が読めなかった状態はオフではなく不明と表示します。
- 配信 URL をクリップボードへ。 RTSP・RTMP・SRT を、サーバー自身のリッスンアドレスから組み立てます。
- 各ストリームの MP4 を日付ごとにまとめ、サムネイルは自動生成。
- その場で展開するインラインプレーヤー。HTTP Range リクエストでシークできます。
- 進捗表示とキャンセル付きのストリーミングダウンロード。
/を押せば絞り込めます。
- サーバー設定のすべて — Logging、API、Hooks、RTSP、RTMP、HLS、WebRTC、SRT にまたがる、型付き・検証付きの65個のコントロール。
- path デフォルトと path ごとのオーバーライドを、MediaMTX が提供しているスコープで。ワイルドカード配下のストリームを保存すると疎なエントリが書かれ、触っていないキーは継承のままです。
- 15個の
runOn*フックすべて。 保存すると path が再起動する箇所には警告が出ます。 - 疎な書き込み — 変更したキーだけ。
API・SPA・メディアを1プロセスで · マルチアーキテクチャ · GET /health · 構造化ログ · PWA · ライトとダーク · 30言語 · データベース不要。
初回起動の初期値を与えるだけです。あとはすべて Config から変更できます。
| 変数 | 既定値 | 用途 |
|---|---|---|
BACKEND_SERVER_MEDIAMTX_URL |
http://mediamtx |
Connect がコンテナ内部から MediaMTX API に到達する先 |
MEDIAMTX_API_PORT |
9997 |
MediaMTX API のポート |
MEDIAMTX_RECORDINGS_DIR |
./recordings |
録画用にマウントするホスト側パス(compose のみ) |
MEDIAMTX_SCREENSHOTS_DIR |
/screenshots |
サムネイルの保存先 |
http://mediamtx は同梱 compose のネットワーク上でしか解決しません。単独の docker run では自分のホストを指定してください。
Browser ──HLS / WebRTC (WHEP)──────────────────────────┐
│ │
│ oRPC (typed) ▼
▼ ┌──────────┐
┌─────────────────────┐ MediaMTX HTTP API │ MediaMTX │
│ mediamtx-connect │ ────────────────────────▶ │ server │
│ Hono API + React SPA│ └──────────┘
└─────────────────────┘ │
│ reads │ writes
▼ ▼
recordings/ + screenshots/ ◀──────────────────── MP4 segments
再生はブラウザから MediaMTX へ。Connect が運ぶのは JSON と、ディスクから読む録画・サムネイルだけです。
| 機能一覧 | 出荷済みのすべての機能・ルート・プロシージャ |
| アーキテクチャ | 各部品のつながり |
| コントリビュート | 開発環境、スクリプト、PR の流れ |
| サンプル | Raspberry Pi カメラ、テスト用のダミーストリーム |
Issue も PR も歓迎です。pnpm install && pnpm dev でサンプルデータ入りのフルスタックが立ち上がります — 詳しくは CONTRIBUTING.md を参照。PR タイトルは conventional commits に従います。行動規範を守っています。