[fix] resolve issues causing reconnect and initial connection failures

This commit is contained in:
dijunkun
2025-11-06 02:43:15 +08:00
parent 96d05049d5
commit 2399769bc1
3 changed files with 225 additions and 192 deletions

View File

@@ -10,38 +10,47 @@
<div class="container">
<h1>CrossDesk Web Client</h1>
<div class="card">
<h2>连接设置</h2>
<div class="option">
<label for="transmission-id">传输ID</label>
<input id="transmission-id" type="text" value="475319798" />
<!-- Connection settings + status -->
<div class="top-card">
<div class="connection-card">
<h2>连接设置</h2>
<div class="option">
<label for="transmission-id">传输ID</label>
<input id="transmission-id" type="text" value="475319798" />
</div>
<div class="option">
<label for="transmission-pwd">密码:</label>
<input id="transmission-pwd" type="password" value="111111" />
</div>
<div class="actions">
<button id="connect" onclick="connect()" disabled>连接</button>
<button
id="disconnect"
style="display: none"
onclick="disconnect()"
>
断开连接
</button>
</div>
</div>
<div class="option">
<label for="transmission-pwd">密码:</label>
<input id="transmission-pwd" type="password" value="111111" />
</div>
<div class="actions">
<button id="connect" onclick="connect()" disabled>连接</button>
<button id="disconnect" style="display: none" onclick="disconnect()">
断开连接
</button>
</div>
</div>
<div class="states">
<div class="state-item">
<p>ICE 连接状态: <span id="ice-connection-state"></span></p>
</div>
<div class="state-item">
<p>ICE 收集状态: <span id="ice-gathering-state"></span></p>
</div>
<div class="state-item">
<p>信令状态: <span id="signaling-state"></span></p>
<div class="status-card">
<h2>状态</h2>
<div class="status-item">
ICE 连接状态: <span id="ice-connection-state"></span>
</div>
<div class="status-item">
信令状态: <span id="signaling-state"></span>
</div>
<div class="status-item">
数据通道: <span id="datachannel-state"></span>
</div>
</div>
</div>
<!-- Video display -->
<div id="media" style="display: none">
<h2>远程画面</h2>
<h2>远程画面 <span id="track-id" class="track-id"></span></h2>
<video
id="video"
playsinline
@@ -51,11 +60,6 @@
muted
></video>
</div>
<div class="card">
<h2>数据通道</h2>
<pre id="data-channel"></pre>
</div>
</div>
<script src="web_client.js"></script>