feat:自定义turn更新|链接恢复机制|帮助页面添加

This commit is contained in:
MatrixSeven
2025-09-05 17:12:22 +08:00
parent 8e4c42bbbe
commit 1e5d74433b
37 changed files with 3355 additions and 2544 deletions

View File

@@ -73,6 +73,12 @@ export default function WebRTCDesktopReceiver({ className, initialCode, onConnec
return;
}
// 检查房间是否已满
if (result.is_room_full) {
showToast('当前房间人数已满,正在传输中无法加入,请稍后再试', "error");
return;
}
// 检查发送方是否在线
if (!result.sender_online) {
showToast('发送方不在线,请确认房间代码是否正确或联系发送方', "error");
@@ -172,6 +178,12 @@ export default function WebRTCDesktopReceiver({ className, initialCode, onConnec
return;
}
// 检查房间是否已满
if (result.is_room_full) {
showToast('当前房间人数已满,正在传输中无法加入,请稍后再试', "error");
return;
}
// 检查发送方是否在线
if (!result.sender_online) {
showToast('发送方不在线,请确认房间代码是否正确或联系发送方', "error");
@@ -221,6 +233,7 @@ export default function WebRTCDesktopReceiver({ className, initialCode, onConnec
autoJoin();
}, [initialCode, desktopShare.isViewing, desktopShare.isConnecting, isJoiningRoom]); // 添加isJoiningRoom依赖
return (
<div className={`space-y-4 sm:space-y-6 ${className || ''}`}>
<div className="bg-white/80 backdrop-blur-sm rounded-xl p-4 sm:p-6 shadow-lg border border-white/20 animate-fade-in-up">
@@ -328,8 +341,8 @@ export default function WebRTCDesktopReceiver({ className, initialCode, onConnec
{/* 桌面显示区域 */}
{desktopShare.remoteStream ? (
<DesktopViewer
stream={desktopShare.remoteStream}
<DesktopViewer
stream={desktopShare.remoteStream}
isConnected={desktopShare.isViewing}
connectionCode={inputCode}
onDisconnect={handleStopViewing}
@@ -344,7 +357,7 @@ export default function WebRTCDesktopReceiver({ className, initialCode, onConnec
<div className="flex items-center justify-center space-x-2 mt-4">
<div className="animate-spin rounded-full h-4 w-4 border-b-2 border-purple-500"></div>
<span className="text-sm text-purple-600">...</span>
</div>
</div>
</div>
</div>
)}

View File

@@ -27,6 +27,25 @@ export default function WebRTCDesktopSender({ className, onConnectionChange }: W
}
}, [onConnectionChange, desktopShare.isWebSocketConnected, desktopShare.isPeerConnected, desktopShare.isConnecting]);
// 监听连接状态变化当P2P连接断开时重置共享状态
useEffect(() => {
// 如果正在共享但P2P连接断开自动重置共享状态
if (desktopShare.isSharing && !desktopShare.isPeerConnected && desktopShare.connectionCode) {
console.log('[DesktopShareSender] 检测到P2P连接断开自动重置共享状态');
const resetState = async () => {
try {
await desktopShare.resetSharing();
console.log('[DesktopShareSender] 已自动重置共享状态');
} catch (error) {
console.error('[DesktopShareSender] 自动重置共享状态失败:', error);
}
};
resetState();
}
}, [desktopShare.isSharing, desktopShare.isPeerConnected, desktopShare.connectionCode, desktopShare.resetSharing]);
// 复制房间代码
const copyCode = useCallback(async (code: string) => {
try {
@@ -71,6 +90,14 @@ export default function WebRTCDesktopSender({ className, onConnectionChange }: W
console.error('[DesktopShareSender] 开始桌面共享失败:', error);
const errorMessage = error instanceof Error ? error.message : '开始桌面共享失败';
showToast(errorMessage, 'error');
// 分享失败时重置状态,让用户重新选择桌面
try {
await desktopShare.resetSharing();
console.log('[DesktopShareSender] 已重置共享状态,用户可以重新选择桌面');
} catch (resetError) {
console.error('[DesktopShareSender] 重置共享状态失败:', resetError);
}
} finally {
setIsLoading(false);
}
@@ -90,6 +117,14 @@ export default function WebRTCDesktopSender({ className, onConnectionChange }: W
console.error('[DesktopShareSender] 切换桌面失败:', error);
const errorMessage = error instanceof Error ? error.message : '切换桌面失败';
showToast(errorMessage, 'error');
// 切换桌面失败时重置状态,让用户重新选择桌面
try {
await desktopShare.resetSharing();
console.log('[DesktopShareSender] 已重置共享状态,用户可以重新选择桌面');
} catch (resetError) {
console.error('[DesktopShareSender] 重置共享状态失败:', resetError);
}
} finally {
setIsLoading(false);
}

View File

@@ -76,7 +76,16 @@ export function WebRTCFileReceive({
console.log('验证响应:', { status: response.status, data });
if (!response.ok || !data.success) {
const errorMessage = data.message || '取件码验证失败';
let errorMessage = data.message || '取件码验证失败';
// 特殊处理房间人数已满的情况
if (data.message?.includes('房间人数已满') || data.message?.includes('正在传输中无法加入')) {
errorMessage = '当前房间人数已满,正在传输中无法加入,请稍后再试';
} else if (data.message?.includes('expired')) {
errorMessage = '房间已过期,请联系发送方重新创建';
} else if (data.message?.includes('not found')) {
errorMessage = '房间不存在,请检查取件码是否正确';
}
// 显示toast错误提示
showToast(errorMessage, 'error');
@@ -85,6 +94,14 @@ export function WebRTCFileReceive({
return false;
}
// 检查房间是否已满
if (data.is_room_full) {
const errorMessage = '当前房间人数已满,正在传输中无法加入,请稍后再试';
showToast(errorMessage, 'error');
console.log('房间已满:', errorMessage);
return false;
}
console.log('取件码验证成功:', data.room);
return true;
} catch (error) {

View File

@@ -141,7 +141,23 @@ export const WebRTCTextReceiver: React.FC<WebRTCTextReceiverProps> = ({
const roomData = await response.json();
if (!response.ok) {
throw new Error(roomData.error || '房间不存在或已过期');
let errorMessage = roomData.error || '房间不存在或已过期';
// 特殊处理房间人数已满的情况
if (roomData.message?.includes('房间人数已满') || roomData.message?.includes('正在传输中无法加入')) {
errorMessage = '当前房间人数已满,正在传输中无法加入,请稍后再试';
} else if (roomData.message?.includes('expired')) {
errorMessage = '房间已过期,请联系发送方重新创建';
} else if (roomData.message?.includes('not found')) {
errorMessage = '房间不存在,请检查取件码是否正确';
}
throw new Error(errorMessage);
}
// 检查房间是否已满
if (roomData.is_room_full) {
throw new Error('当前房间人数已满,正在传输中无法加入,请稍后再试');
}
console.log('=== 房间验证成功 ===', roomData);