44 lines
1.7 KiB
HTML
44 lines
1.7 KiB
HTML
<!doctype html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<title>开始直播 · 直播 SFU 分流 Demo</title>
|
||
<link rel="stylesheet" href="/static/styles.css" />
|
||
</head>
|
||
<body>
|
||
<div class="topbar">
|
||
<div class="brand">直播 SFU 分流 Demo <small>Cloudflare Realtime · SRS</small></div>
|
||
<nav><a href="/">首页</a><a href="/watch">观看直播</a></nav>
|
||
</div>
|
||
<div class="band">
|
||
<div class="hero"><h1>开始直播</h1><p>房间 <b id="roomName">demo</b> · 选择分发后端，一路推流将扇出到所选 SFU。</p></div>
|
||
<div class="two">
|
||
<div class="card">
|
||
<h3>本地预览</h3>
|
||
<video id="local" autoplay playsinline muted></video>
|
||
<div class="check">
|
||
<label><input type="checkbox" name="backend" value="cloudflare" checked /> Cloudflare Realtime（主 SFU）</label>
|
||
</div>
|
||
<div class="check">
|
||
<label><input type="checkbox" name="backend" value="srs" checked /> SRS（本地对照）</label>
|
||
</div>
|
||
<div class="row" style="margin-top:10px">
|
||
<button id="start">开始推流</button>
|
||
<button id="stop" class="danger">停止推流</button>
|
||
</div>
|
||
<div id="status" style="margin-top:10px"><span class="muted">未发布</span></div>
|
||
</div>
|
||
<div class="card">
|
||
<h3>分发状态</h3>
|
||
<div id="status2" class="muted">尚未开始</div>
|
||
<h3 style="margin-top:14px">日志</h3>
|
||
<div id="log" class="log"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<script src="/static/app.js"></script>
|
||
<script>LiveSFU.initPublish();</script>
|
||
</body>
|
||
</html>
|