From a53ece5036c1fa61a63fe5f9e0cd3519210ab928 Mon Sep 17 00:00:00 2001
From: chenyao <1219716595@qq.com>
Date: Fri, 07 Aug 2026 09:44:27 +0800
Subject: [PATCH] feat:兼容分辨率低不出现滚动条
---
applications/drone-command/src/views/audioCall.vue | 37 +++++++++++++++++++++++--------------
1 files changed, 23 insertions(+), 14 deletions(-)
diff --git a/applications/drone-command/src/views/audioCall.vue b/applications/drone-command/src/views/audioCall.vue
index 9957564..b86e777 100644
--- a/applications/drone-command/src/views/audioCall.vue
+++ b/applications/drone-command/src/views/audioCall.vue
@@ -36,10 +36,11 @@
import { ref, computed, onBeforeUnmount } from 'vue'
/** ✅ 你的 WS 地址前缀（后面拼 userId） */
-const WS_BASE = 'wss://wrj.shuixiongit.com/ws/chat?userId='
+// const WS_BASE = 'ws://218.202.104.82:38201/ws/chat'
+const WS_BASE = 'ws://220.177.172.27:8100/webrtc/ws/chat'
-const uid = ref('2')
-const peerUid = ref('3')
+const uid = ref('2021474568497131521')
+const peerUid = ref('2021474815063486465')
const connected = ref(false)
const state = ref('idle') // idle | calling | ringing | in-call
@@ -64,13 +65,11 @@
const s = String(seconds.value % 60).padStart(2, '0')
return `${m}:${s}`
})
-
function startTimer() {
stopTimer()
seconds.value = 0
timer = setInterval(() => seconds.value++, 1000)
}
-
function stopTimer() {
if (timer) clearInterval(timer)
timer = null
@@ -78,7 +77,6 @@
// 心跳
let pingTimer = null
-
function startPing() {
stopPing()
// 每 25 秒发一次 ping（你后端有 PING/PONG）
@@ -86,7 +84,6 @@
if (connected.value) send('ping', 'system', null)
}, 25000)
}
-
function stopPing() {
if (pingTimer) clearInterval(pingTimer)
pingTimer = null
@@ -121,7 +118,14 @@
function createPC() {
pc = new RTCPeerConnection({
- iceServers: [{ urls: 'stun:stun.l.google.com:19302' }],
+ iceServers: [{ urls: 'stun:stun.l.google.com:19302' },
+ { urls: 'stun:stun.l.google.com:19302' },
+ { urls: 'stun:stun1.l.google.com:19302' },
+ { urls: 'stun:stun.stunprotocol.org:3478' },
+ // 添加多个公共TURN服务器以提高跨网络连接成功率
+ { urls: ['turn:freeturn.net:80', 'turn:freeturn.net:443'], username: 'free', credential: 'free' },
+ // 备用TURN服务器
+ { urls: 'turn:turn.cloudlifter.io:443', username: 'webrtc', credential: 'webrtc' }],
})
pc.onicecandidate = (e) => {
@@ -130,13 +134,13 @@
}
}
+ // 步骤7 接收音频流并且播放
pc.ontrack = (e) => {
log('✅ 收到远端音频流')
const stream = e.streams[0]
if (remoteAudio.value) {
remoteAudio.value.srcObject = stream
- remoteAudio.value.play().catch(() => {
- })
+ remoteAudio.value.play().catch(() => {})
}
}
@@ -172,6 +176,7 @@
pc.getSenders().map(s => (s.track ? s.track.id : null)).filter(Boolean)
)
+ // 步骤6 发送音频流
stream.getTracks().forEach(track => {
if (!existingTrackIds.has(track.id)) {
pc.addTrack(track, stream)
@@ -184,6 +189,7 @@
return stream
}
+// 步骤5
async function flushCandidates() {
if (!pc || !pc.remoteDescription) return
while (pendingCandidates.length) {
@@ -240,6 +246,7 @@
return
}
+ // 步骤2
if (t === 'offer') {
// 被叫收到 offer：只有点击接听后才真正应答（你要求“先点接听”）
offeredByPeer = true
@@ -259,10 +266,12 @@
return
}
+ // 步骤3
if (t === 'answer') {
log('✅ 收到 answer，通话建立')
if (!pc) createPC()
await pc.setRemoteDescription(new RTCSessionDescription(msg.payload?.sdp))
+ // 步骤4
await flushCandidates()
state.value = 'in-call'
@@ -302,7 +311,7 @@
function connectWS() {
if (ws) ws.close()
- ws = new WebSocket(WS_BASE + encodeURIComponent(uid.value))
+ ws = new WebSocket(WS_BASE, "eyJhbGciOiJIUzUxMiJ9.eyJ1c2VyX2lkIjoyMDIxNDc0NTY4NDk3MTMxNTIxLCJ1c2VyX2tleSI6Ijc5MDE3ZGEwLTZlZjItNGU0MS05MzdiLWFiZjM4NzRkNTYwMSIsInVzZXJuYW1lIjoieW9uZ2h1MSJ9.hEoBlIejSOyn44aA1FZrtlVHsrbmA84KX_5Qq2Mz7slO4jNlbJkFvzuomT7EqI9QigucNzULDjfiA9IHPfww8Q")
ws.onopen = () => {
connected.value = true
@@ -373,6 +382,7 @@
// ✅ 不会重复 addTrack
await ensureLocalTracksAdded()
+ // 步骤1
const offer = await pc.createOffer()
await pc.setLocalDescription(offer)
@@ -380,6 +390,7 @@
log('➡️ 已发送 offer 给', peerUid.value)
}
+// 步骤2
async function answerOffer(offerSdp, from) {
if (!offerSdp) {
log('❌ offer sdp 为空，无法接听')
@@ -411,8 +422,7 @@
function cleanup(sendToPeer) {
try {
if (sendToPeer) send('hangup', peerUid.value, null)
- } catch {
- }
+ } catch {}
stopTimer()
@@ -442,4 +452,3 @@
if (ws) ws.close()
})
</script>
-
\ No newline at end of file
--
Gitblit v1.9.3