fix:排位赛匹配页面逻辑优化:增加超时判断&websocket丢失判断
This commit is contained in:
@@ -3,22 +3,90 @@ import { ref, onMounted, onBeforeUnmount } from "vue";
|
|||||||
import { onLoad, onShow, onHide } from "@dcloudio/uni-app";
|
import { onLoad, onShow, onHide } from "@dcloudio/uni-app";
|
||||||
import Container from "@/components/Container.vue";
|
import Container from "@/components/Container.vue";
|
||||||
import Matching from "@/components/Matching.vue";
|
import Matching from "@/components/Matching.vue";
|
||||||
import { matchGameAPI } from "@/apis";
|
import { matchGameAPI, getBattleAPI } from "@/apis";
|
||||||
import { MESSAGETYPESV2 } from "@/constants";
|
import { MESSAGETYPESV2 } from "@/constants";
|
||||||
|
|
||||||
const gameType = ref(0);
|
const gameType = ref(0);
|
||||||
const teamSize = ref(0);
|
const teamSize = ref(0);
|
||||||
const onComplete = ref(null);
|
const onComplete = ref(null);
|
||||||
|
|
||||||
|
/** 匹配超时计时器,用于检测 WS 消息丢失或真正超时 */
|
||||||
|
const matchTimeoutTimer = ref(null);
|
||||||
|
|
||||||
|
/** 匹配超时阈值(ms),后端设置 15s 匹配,前端预留 5s 冗余 */
|
||||||
|
const MATCH_TIMEOUT_MS = 20 * 1000;
|
||||||
|
|
||||||
|
/** 清除超时计时器 */
|
||||||
|
const clearMatchTimeout = () => {
|
||||||
|
if (matchTimeoutTimer.value) {
|
||||||
|
clearTimeout(matchTimeoutTimer.value);
|
||||||
|
matchTimeoutTimer.value = null;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 超时处理:查询后端是否已分配对局
|
||||||
|
* - 有对局 → WS 消息丢失场景,自动跳入
|
||||||
|
* - 无对局 → 真正超时,提示用户并返回大厅
|
||||||
|
*/
|
||||||
|
const handleMatchTimeout = async () => {
|
||||||
|
try {
|
||||||
|
const battle = await getBattleAPI();
|
||||||
|
if (battle && battle.matchId) {
|
||||||
|
uni.showToast({ title: "匹配成功,正在进入...", icon: "none" });
|
||||||
|
if (battle.mode <= 3) {
|
||||||
|
uni.redirectTo({ url: `/pages/team-battle?battleId=${battle.matchId}` });
|
||||||
|
} else {
|
||||||
|
uni.redirectTo({ url: `/pages/melee-battle?battleId=${battle.matchId}` });
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
uni.showToast({ title: "匹配超时,请重试", icon: "none" });
|
||||||
|
try {
|
||||||
|
if (gameType.value && teamSize.value) {
|
||||||
|
await matchGameAPI(false, gameType.value, teamSize.value);
|
||||||
|
}
|
||||||
|
} catch (_) { /* 取消失败忽略 */ }
|
||||||
|
uni.navigateBack();
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
uni.showToast({ title: "匹配超时,请重试", icon: "none" });
|
||||||
|
uni.navigateBack();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
async function stopMatch() {
|
async function stopMatch() {
|
||||||
uni.$showHint(3);
|
uni.$showHint(3);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 取消匹配,带容错处理:
|
||||||
|
* - 取消成功 → 返回大厅
|
||||||
|
* - 取消失败(后端已分配对局但 WS 未到达)→ 查询并跳入当前对局
|
||||||
|
*/
|
||||||
async function cancelMatch() {
|
async function cancelMatch() {
|
||||||
if (gameType.value && teamSize.value) {
|
clearMatchTimeout();
|
||||||
await matchGameAPI(false, gameType.value, teamSize.value);
|
try {
|
||||||
|
if (gameType.value && teamSize.value) {
|
||||||
|
await matchGameAPI(false, gameType.value, teamSize.value);
|
||||||
|
}
|
||||||
|
uni.navigateBack();
|
||||||
|
} catch (e) {
|
||||||
|
// 取消匹配接口失败,尝试查询是否已被分配对局
|
||||||
|
try {
|
||||||
|
const battle = await getBattleAPI();
|
||||||
|
if (battle && battle.matchId) {
|
||||||
|
if (battle.mode <= 3) {
|
||||||
|
uni.redirectTo({ url: `/pages/team-battle?battleId=${battle.matchId}` });
|
||||||
|
} else {
|
||||||
|
uni.redirectTo({ url: `/pages/melee-battle?battleId=${battle.matchId}` });
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
uni.navigateBack();
|
||||||
|
}
|
||||||
|
} catch (_) {
|
||||||
|
uni.navigateBack();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
uni.navigateBack()
|
|
||||||
}
|
}
|
||||||
|
|
||||||
async function onReceiveMessage(msg) {
|
async function onReceiveMessage(msg) {
|
||||||
@@ -26,6 +94,8 @@ async function onReceiveMessage(msg) {
|
|||||||
onComplete.value = () => {}
|
onComplete.value = () => {}
|
||||||
}
|
}
|
||||||
if (msg.type === MESSAGETYPESV2.AboutToStart) {
|
if (msg.type === MESSAGETYPESV2.AboutToStart) {
|
||||||
|
// 收到开始消息,清除超时计时器
|
||||||
|
clearMatchTimeout();
|
||||||
// 使用后端下发的 mode 字段判断跳转目标,与好友约战(battle-room.vue)保持一致
|
// 使用后端下发的 mode 字段判断跳转目标,与好友约战(battle-room.vue)保持一致
|
||||||
// mode <= 3 为团队对抗,mode > 3 为大乱斗,覆盖全部 gameType(1~5),不再遗漏
|
// mode <= 3 为团队对抗,mode > 3 为大乱斗,覆盖全部 gameType(1~5),不再遗漏
|
||||||
if (msg.mode <= 3) {
|
if (msg.mode <= 3) {
|
||||||
@@ -56,6 +126,7 @@ onMounted(() => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
onBeforeUnmount(() => {
|
onBeforeUnmount(() => {
|
||||||
|
clearMatchTimeout();
|
||||||
uni.setKeepScreenOn({
|
uni.setKeepScreenOn({
|
||||||
keepScreenOn: false,
|
keepScreenOn: false,
|
||||||
});
|
});
|
||||||
@@ -66,6 +137,9 @@ onBeforeUnmount(() => {
|
|||||||
onShow(async () => {
|
onShow(async () => {
|
||||||
if (gameType.value && teamSize.value) {
|
if (gameType.value && teamSize.value) {
|
||||||
matchGameAPI(true, gameType.value, teamSize.value);
|
matchGameAPI(true, gameType.value, teamSize.value);
|
||||||
|
// 启动超时计时器,防止 WS 消息丢失或长时间无对手导致用户卡死
|
||||||
|
clearMatchTimeout();
|
||||||
|
matchTimeoutTimer.value = setTimeout(handleMatchTimeout, MATCH_TIMEOUT_MS);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user