337 lines
13 KiB
JavaScript
337 lines
13 KiB
JavaScript
|
import { defineStore } from 'pinia';
|
|||
|
|
import {
|
|||
|
|
CALLSTATUS,
|
|||
|
|
CALL_TYPES,
|
|||
|
|
CALL_TYPE,
|
|||
|
|
CALL_INVITE_TEXT,
|
|||
|
|
} from '../contants';
|
|||
|
|
import {
|
|||
|
|
CALLKIT_EVENT_CODE,
|
|||
|
|
CALLKIT_EVENT_TYPE,
|
|||
|
|
} from '../contants/callKitEvent';
|
|||
|
|
import { useInitCallKit } from '../index';
|
|||
|
|
import useCallKitEvent from '../callKitManage/useCallKitEvent';
|
|||
|
|
import useSendSignalMsgs from '../callKitManage/useSendSignalMsgs';
|
|||
|
|
import createUid from '../utils/createUid';
|
|||
|
|
const { EVENT_NAME, PUB_CHANNEL_EVENT } = useCallKitEvent();
|
|||
|
|
|
|||
|
|
const useAgoraChannelStore = defineStore('agoraChannelStore', {
|
|||
|
|
state: () => ({
|
|||
|
|
emClientInfos: {
|
|||
|
|
apiUrl: '',
|
|||
|
|
appKey: '',
|
|||
|
|
loginUserId: '',
|
|||
|
|
clientResource: '',
|
|||
|
|
accessToken: '',
|
|||
|
|
},
|
|||
|
|
callKitStatus: {
|
|||
|
|
localClientStatus: CALLSTATUS.idle, //callkit状态
|
|||
|
|
channelInfos: {
|
|||
|
|
channelName: '', //频道名
|
|||
|
|
agoraChannelToken: '', //频道token
|
|||
|
|
agoraUserId: '', //频道用户id,
|
|||
|
|
callType: CALL_TYPES.SINGLE_VOICE, //0 语音 1 视频 2 多人音视频
|
|||
|
|
callId: null, //会议ID
|
|||
|
|
channelUsers: {}, //频道内用户
|
|||
|
|
callerDevId: '', //主叫方设备ID
|
|||
|
|
calleeDevId: '', //被叫方设备ID
|
|||
|
|
callerIMName: '', //主叫方环信ID
|
|||
|
|
calleeIMName: '', //被叫方环信ID
|
|||
|
|
groupId: '', //群组ID
|
|||
|
|
},
|
|||
|
|
//被邀请对象 单人为string 多人为array
|
|||
|
|
inviteTarget: null,
|
|||
|
|
},
|
|||
|
|
callKitTimer: null,
|
|||
|
|
}),
|
|||
|
|
actions: {
|
|||
|
|
/* emClient */
|
|||
|
|
initEmClientInfos(emClient) {
|
|||
|
|
console.log('initEmClientInfos', emClient);
|
|||
|
|
if (!emClient) return;
|
|||
|
|
this.emClientInfos.apiUrl = emClient.apiUrl;
|
|||
|
|
this.emClientInfos.appKey = emClient.appKey;
|
|||
|
|
this.emClientInfos.loginUserId = emClient.user;
|
|||
|
|
this.emClientInfos.accessToken = emClient.token;
|
|||
|
|
this.emClientInfos.clientResource = emClient.clientResource;
|
|||
|
|
},
|
|||
|
|
/* CallKit status 管理 */
|
|||
|
|
//初始化频道信息
|
|||
|
|
initChannelInfos() {
|
|||
|
|
this.callKitStatus.localClientStatus = CALLSTATUS.idle;
|
|||
|
|
this.callKitStatus.channelInfos = {
|
|||
|
|
channelName: '', //频道名
|
|||
|
|
agoraChannelToken: '', //频道token
|
|||
|
|
agoraUid: '', //频道用户id
|
|||
|
|
callType: CALL_TYPES.SINGLE_VOICE, //0 语音 1 视频 2 多人音视频
|
|||
|
|
callId: null, //会议ID
|
|||
|
|
channelUsers: {}, //频道内用户
|
|||
|
|
callerDevId: '', //主叫方设备ID
|
|||
|
|
calleeDevId: '', //被叫方设备ID
|
|||
|
|
confrontId: '', //要处理的目标ID
|
|||
|
|
callerIMName: '', //主叫方环信ID
|
|||
|
|
calleeIMName: '', //被叫方环信ID
|
|||
|
|
groupId: '', //群组ID
|
|||
|
|
};
|
|||
|
|
this.callKitStatus.inviteTarget = null;
|
|||
|
|
this.callKitTimer && clearTimeout(this.callKitTimer);
|
|||
|
|
},
|
|||
|
|
//更新localStatus
|
|||
|
|
updateLocalStatus(typeCode) {
|
|||
|
|
console.log('>>>>>开始变更本地状态为 typeCode', typeCode);
|
|||
|
|
this.callKitStatus.localClientStatus = typeCode;
|
|||
|
|
},
|
|||
|
|
//更新频道信息
|
|||
|
|
updateChannelInfos(msgBody) {
|
|||
|
|
console.log('触发更新频道信息', msgBody);
|
|||
|
|
const { from, to, ext } = msgBody || {};
|
|||
|
|
const params = {
|
|||
|
|
channelName:
|
|||
|
|
ext.channelName || this.callKitStatus.channelInfos.channelName,
|
|||
|
|
callId: ext.callId || this.callKitStatus.channelInfos.callId,
|
|||
|
|
callType:
|
|||
|
|
CALL_TYPE[ext.type] || this.callKitStatus.channelInfos.callType,
|
|||
|
|
callerDevId: ext.callerDevId || 0,
|
|||
|
|
calleeDevId: ext.calleeDevId,
|
|||
|
|
callerIMName: from,
|
|||
|
|
calleeIMName: to,
|
|||
|
|
groupId: ext?.ext?.groupId ? ext.ext.groupId : '',
|
|||
|
|
};
|
|||
|
|
console.log('%c将要更新的信息内容为', 'color:red', params);
|
|||
|
|
Object.assign(this.callKitStatus.channelInfos, params);
|
|||
|
|
},
|
|||
|
|
/* CallKit Timer */
|
|||
|
|
//用作邀请信息发送之后发起计时30s。
|
|||
|
|
startCallKitTimer() {
|
|||
|
|
const { sendCannelMsg } = useSendSignalMsgs();
|
|||
|
|
if (this.callKitTimer) {
|
|||
|
|
clearTimeout(this.callKitTimer);
|
|||
|
|
this.callKitTimer = null;
|
|||
|
|
}
|
|||
|
|
//对外发布应答事件
|
|||
|
|
this.callKitTimer = setTimeout(() => {
|
|||
|
|
const targetId = this.callKitStatus.inviteTarget;
|
|||
|
|
//发送cannel信令
|
|||
|
|
sendCannelMsg({
|
|||
|
|
targetId,
|
|||
|
|
callId: this.callKitStatus.channelInfos.callId,
|
|||
|
|
});
|
|||
|
|
const eventParams = {
|
|||
|
|
type: CALLKIT_EVENT_TYPE[CALLKIT_EVENT_CODE.TIMEOUT],
|
|||
|
|
ext: { message: '通话超时未接听' },
|
|||
|
|
callType: this.callKitStatus.channelInfos.callType,
|
|||
|
|
eventHxId: targetId,
|
|||
|
|
};
|
|||
|
|
PUB_CHANNEL_EVENT(EVENT_NAME, { ...eventParams });
|
|||
|
|
this.updateLocalStatus(CALLSTATUS.idle); //更改状态为闲置
|
|||
|
|
}, 30000);
|
|||
|
|
},
|
|||
|
|
/* 多人会议使用 获取群组内的成员 */
|
|||
|
|
getTheGroupMembers(groupId) {
|
|||
|
|
const { CallKitEMClient } = useInitCallKit();
|
|||
|
|
if (!groupId) return;
|
|||
|
|
return new Promise((resolve, reject) => {
|
|||
|
|
let pageNum = 1,
|
|||
|
|
pageSize = 100;
|
|||
|
|
let option = {
|
|||
|
|
pageNum: pageNum,
|
|||
|
|
pageSize: pageSize,
|
|||
|
|
groupId: groupId,
|
|||
|
|
};
|
|||
|
|
CallKitEMClient.listGroupMembers(option)
|
|||
|
|
.then((res) => resolve(res?.data))
|
|||
|
|
.catch((err) => reject(err));
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
//发起音视频邀请
|
|||
|
|
async sendInviteMessage(targetId, callType, groupId) {
|
|||
|
|
console.log('>>>>>>>>>', targetId, callType, groupId);
|
|||
|
|
const { sendInviteMsg } = useSendSignalMsgs();
|
|||
|
|
//非空闲状态直接拒绝发送邀请信息[除了多人，因为涉及到多人通话中需要邀请他人入会]
|
|||
|
|
if (
|
|||
|
|
callType !== 2 &&
|
|||
|
|
this.callKitStatus.localClientStatus !== CALLSTATUS.idle
|
|||
|
|
)
|
|||
|
|
return;
|
|||
|
|
const channelInfors = {
|
|||
|
|
channelName: `${callType}_${createUid()}`, //频道名
|
|||
|
|
callId: createUid(),
|
|||
|
|
inviteMsgContent: CALL_INVITE_TEXT[callType],
|
|||
|
|
groupId: groupId, //只有为群聊多人邀请时这个参数才有用
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
this.callKitStatus.inviteTarget = targetId;
|
|||
|
|
try {
|
|||
|
|
//如果为数组就遍历发送
|
|||
|
|
if (Array.isArray(targetId)) {
|
|||
|
|
targetId.forEach((userId) => {
|
|||
|
|
sendInviteMsg(userId, callType, channelInfors);
|
|||
|
|
});
|
|||
|
|
console.log('>>>>>群组多人邀请开始遍历发消息');
|
|||
|
|
} else {
|
|||
|
|
//非数组就单条发送
|
|||
|
|
await sendInviteMsg(targetId, callType, channelInfors);
|
|||
|
|
}
|
|||
|
|
console.log('channelInforschannelInfors', channelInfors);
|
|||
|
|
this.updateLocalStatus(CALLSTATUS.inviting);
|
|||
|
|
} catch (error) {
|
|||
|
|
console.log('%c邀请信息发送失败', 'color:red', error);
|
|||
|
|
}
|
|||
|
|
//更改部分ChannelInfos
|
|||
|
|
const params = {
|
|||
|
|
from: this.emClientInfos.loginUserId,
|
|||
|
|
to: callType === CALL_TYPES.MULTI_VIDEO ? '' : targetId,
|
|||
|
|
ext: {
|
|||
|
|
channelName: channelInfors.channelName,
|
|||
|
|
callId: channelInfors.callId,
|
|||
|
|
type: callType,
|
|||
|
|
callerDevId: this.emClientInfos.clientResource,
|
|||
|
|
},
|
|||
|
|
};
|
|||
|
|
//如果存在群组ID则增加ext字段进入到groupId
|
|||
|
|
if (callType === CALL_TYPES.MULTI_VIDEO && groupId)
|
|||
|
|
params.ext.ext = { groupId };
|
|||
|
|
console.log('邀请发送 callType为', callType);
|
|||
|
|
this.updateChannelInfos(params);
|
|||
|
|
//单人邀请开启超时挂断，多人则忽略
|
|||
|
|
if (callType !== CALL_TYPES.MULTI_VIDEO) {
|
|||
|
|
this.startCallKitTimer();
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//【多人】在会议中邀请邀请--会议中邀请不生成新的频道信息
|
|||
|
|
async inMultiChanelSendInviteMsg(targetId, callType) {
|
|||
|
|
const { sendInviteMsg } = useSendSignalMsgs();
|
|||
|
|
if (!targetId) throw 'targetId must pass！';
|
|||
|
|
if (callType === undefined || callType === null || callType < 0)
|
|||
|
|
throw 'callType must pass！';
|
|||
|
|
if (
|
|||
|
|
(Array.isArray(targetId) && targetId.length < 1) ||
|
|||
|
|
targetId.length > 15
|
|||
|
|
)
|
|||
|
|
throw 'targetId length > 15 or length < 1';
|
|||
|
|
|
|||
|
|
const channelInfors = {
|
|||
|
|
channelName: this.callKitStatus.channelInfos.channelName, //频道名
|
|||
|
|
callId: this.callKitStatus.channelInfos.callId,
|
|||
|
|
inviteMsgContent: CALL_INVITE_TEXT[callType],
|
|||
|
|
groupId: this.callKitStatus.channelInfos.groupId, //只有为群聊多人邀请时这个参数才有用
|
|||
|
|
};
|
|||
|
|
this.callKitStatus.inviteTarget = targetId;
|
|||
|
|
try {
|
|||
|
|
//如果为数组就遍历发送
|
|||
|
|
if (Array.isArray(targetId)) {
|
|||
|
|
targetId.forEach((userId) => {
|
|||
|
|
sendInviteMsg(userId, callType, channelInfors);
|
|||
|
|
});
|
|||
|
|
console.log('>>>>>群组多人邀请开始遍历发消息');
|
|||
|
|
}
|
|||
|
|
} catch (error) {
|
|||
|
|
console.log('%c邀请信息发送失败', 'color:red', error);
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//发送挂断信令
|
|||
|
|
handleCancelCall() {
|
|||
|
|
const { sendCannelMsg } = useSendSignalMsgs();
|
|||
|
|
const targetId = this.callKitStatus.inviteTarget;
|
|||
|
|
if (!targetId) return console.log('>>>挂断目标ID为空', targetId);
|
|||
|
|
//多人遍历发送取消
|
|||
|
|
if (this.callKitStatus.channelInfos.callType === CALL_TYPES.MULTI_VIDEO) {
|
|||
|
|
targetId.length &&
|
|||
|
|
targetId.forEach((userHxId) => {
|
|||
|
|
sendCannelMsg({
|
|||
|
|
targetId: userHxId,
|
|||
|
|
callId: this.callKitStatus.channelInfos.callId,
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
//对外频道接听事件发布事件
|
|||
|
|
const eventParams = {
|
|||
|
|
type: CALLKIT_EVENT_TYPE[CALLKIT_EVENT_CODE.CANCEL],
|
|||
|
|
ext: { message: '多人音视频通话已取消' },
|
|||
|
|
callType: CALL_TYPES.MULTI_VIDEO,
|
|||
|
|
eventHxId: this.callKitStatus.channelInfos.groupId,
|
|||
|
|
};
|
|||
|
|
PUB_CHANNEL_EVENT(EVENT_NAME, { ...eventParams });
|
|||
|
|
this.updateLocalStatus(CALLSTATUS.idle);
|
|||
|
|
} else {
|
|||
|
|
sendCannelMsg({
|
|||
|
|
targetId,
|
|||
|
|
callId: this.callKitStatus.channelInfos.callId,
|
|||
|
|
});
|
|||
|
|
//对外频道接听事件发布事件
|
|||
|
|
const eventParams = {
|
|||
|
|
type: CALLKIT_EVENT_TYPE[CALLKIT_EVENT_CODE.CANCEL],
|
|||
|
|
ext: { message: '通话已取消' },
|
|||
|
|
callType: this.callKitStatus.channelInfos.callType,
|
|||
|
|
eventHxId: targetId,
|
|||
|
|
};
|
|||
|
|
PUB_CHANNEL_EVENT(EVENT_NAME, { ...eventParams });
|
|||
|
|
this.updateLocalStatus(CALLSTATUS.idle);
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//请求频道Token
|
|||
|
|
/**
|
|||
|
|
* @function requestRtcChannelToken
|
|||
|
|
* 该方法主要作用为请求Agora Rtc频道对应的token，其积极可抽象理解为拿到某频道对应的门钥匙。
|
|||
|
|
* !但此方法所请求的接口为环信内部Demo演示接口，仅供环信内部自己使用如自己项目使用。请找后端协助部署一个类似的接口服务。
|
|||
|
|
*/
|
|||
|
|
requestRtcChannelToken() {
|
|||
|
|
const { channelName } = this.callKitStatus.channelInfos;
|
|||
|
|
const { apiUrl, appKey, loginUserId, accessToken } = this.emClientInfos;
|
|||
|
|
const requestUrl = `${apiUrl}/token/rtcToken/v1?userAccount=${loginUserId}&channelName=${channelName}&appkey=${encodeURIComponent(
|
|||
|
|
appKey
|
|||
|
|
)}`;
|
|||
|
|
return new Promise((resolve, reject) => {
|
|||
|
|
uni.request({
|
|||
|
|
url: requestUrl,
|
|||
|
|
header: {
|
|||
|
|
Authorization: `Bearer ${accessToken}`, //自定义请求头信息
|
|||
|
|
},
|
|||
|
|
success: (result) => {
|
|||
|
|
console.log('>>>>>频道token已获取', result?.data);
|
|||
|
|
resolve(result?.data);
|
|||
|
|
},
|
|||
|
|
fail: (e) => {
|
|||
|
|
console.error('>>>>rtc token 获取失败', e);
|
|||
|
|
uni.showToast({ icon: 'none', title: 'rtc token 请求失败' });
|
|||
|
|
reject(e);
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* @function requestInChannelMapHxId
|
|||
|
|
* 该方法作用为拿到频道内uid与环信id的映射关系，例如在频道内展示uid与之对应的环信ID，因此需要该接口取到uid的映射关系，非必须接口，
|
|||
|
|
* 但此Demo多人音视频通话中有用到。
|
|||
|
|
* !同样此方法如果项目中需要类似的需求，也请后端协助搭建类型功能接口，供项目中使用。
|
|||
|
|
*/
|
|||
|
|
//请求频道内uid映射的环信id
|
|||
|
|
requestInChannelMapHxId() {
|
|||
|
|
const { channelName } = this.callKitStatus.channelInfos;
|
|||
|
|
const { apiUrl, appKey, loginUserId, accessToken } = this.emClientInfos;
|
|||
|
|
const requestUrl = `${apiUrl}/channel/mapper?userAccount=${loginUserId}&channelName=${channelName}&appkey=${encodeURIComponent(
|
|||
|
|
appKey
|
|||
|
|
)}`;
|
|||
|
|
console.log('>>>>requestUrl', `Bearer ${accessToken}`);
|
|||
|
|
return new Promise((resolve, reject) => {
|
|||
|
|
uni.request({
|
|||
|
|
url: requestUrl,
|
|||
|
|
header: {
|
|||
|
|
Authorization: `Bearer ${accessToken}`, //自定义请求头信息
|
|||
|
|
},
|
|||
|
|
success: (result) => {
|
|||
|
|
console.log('result', result?.data);
|
|||
|
|
resolve(result?.data);
|
|||
|
|
},
|
|||
|
|
fail: (e) => {
|
|||
|
|
console.error('>>>>rtc token 获取失败', e);
|
|||
|
|
uni.showToast({ icon: 'none', title: 'rtc token 请求失败' });
|
|||
|
|
reject(e);
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
export default useAgoraChannelStore;
|