neoris/openvidu
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

frontend: refactor message handling to use bound method for event listener

Browse Source
This commit is contained in:
Carlos Santos 2025-05-12 11:15:24 +02:00
parent 6c9e1d9b50
commit 41e7b645ee
1 changed files with 51 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

96
frontend/projects/shared-meet-components/src/lib/services/webcomponent-manager/webcomponent-manager.service.ts
View File

@ -21,6 +21,7 @@ import { OutboundEventMessage, InboundCommandMessage } from 'webcomponent/src/mo
}) })
export class WebComponentManagerService { export class WebComponentManagerService {
protected isListenerStarted = false; protected isListenerStarted = false;
protected boundHandleMessage: (event: MessageEvent) => Promise<void>;
protected log; protected log;
constructor( constructor(
@ -31,6 +32,7 @@ export class WebComponentManagerService {
protected httpService: HttpService protected httpService: HttpService
) { ) {
this.log = this.loggerService.get('OpenVidu Meet - WebComponentManagerService'); this.log = this.loggerService.get('OpenVidu Meet - WebComponentManagerService');
this.boundHandleMessage = this.handleMessage.bind(this);
} }
startCommandsListener(): void { startCommandsListener(): void {
@ -38,56 +40,15 @@ export class WebComponentManagerService {
this.isListenerStarted = true; this.isListenerStarted = true;
// Listen for messages from the iframe // Listen for messages from the iframe
window.addEventListener('message', async (event) => { window.addEventListener('message', this.boundHandleMessage);
const message: InboundCommandMessage = event.data; this.log.d('Started commands listener');
const parentDomain = this.contextService.getParentDomain();
const { command, payload } = message;
if (!parentDomain) {
if (command === WebComponentCommand.INITIALIZE) {
if (!payload || !('domain' in payload)) {
console.error('Parent domain not provided in message payload');
return;
}
this.log.d(`Parent domain set: ${event.origin}`);
this.contextService.setParentDomain(payload['domain']);
}
return;
}
if (event.origin !== parentDomain) {
// console.warn(`Untrusted origin: ${event.origin}`);
return;
}
console.debug('Message received from parent:', event.data);
// TODO: reject if room is not connected
switch (command) {
case WebComponentCommand.END_MEETING:
// Moderator only
if (this.contextService.isModeratorParticipant()) {
const roomId = this.contextService.getRoomId();
await this.httpService.endMeeting(roomId);
}
break;
// case WebComponentCommand.TOGGLE_CHAT:
// Toggle chat
// this.panelService.togglePanel(PanelType.CHAT);
// break;
case WebComponentCommand.LEAVE_ROOM:
// Leave room.
await this.openviduService.disconnectRoom();
break;
default:
break;
}
});
} }
stopCommandsListener(): void { stopCommandsListener(): void {
if (!this.isListenerStarted) return; if (!this.isListenerStarted) return;
this.isListenerStarted = false; this.isListenerStarted = false;
window.removeEventListener('message', this.startCommandsListener); window.removeEventListener('message', this.boundHandleMessage);
this.log.d('Stopped commands listener');
} }
sendMessageToParent(event: OutboundEventMessage) { sendMessageToParent(event: OutboundEventMessage) {
@ -96,4 +57,49 @@ export class WebComponentManagerService {
const origin = this.contextService.getParentDomain(); const origin = this.contextService.getParentDomain();
window.parent.postMessage(event, origin); window.parent.postMessage(event, origin);
} }
protected async handleMessage(event: MessageEvent): Promise<void> {
const message: InboundCommandMessage = event.data;
const parentDomain = this.contextService.getParentDomain();
const { command, payload } = message;
if (!parentDomain) {
if (command === WebComponentCommand.INITIALIZE) {
if (!payload || !('domain' in payload)) {
console.error('Parent domain not provided in message payload');
return;
}
this.log.d(`Parent domain set: ${event.origin}`);
this.contextService.setParentDomain(payload['domain']);
}
return;
}
if (event.origin !== parentDomain) {
// console.warn(`Untrusted origin: ${event.origin}`);
return;
}
console.debug('Message received from parent:', event.data);
// TODO: reject if room is not connected
switch (command) {
case WebComponentCommand.END_MEETING:
// Moderator only
if (this.contextService.isModeratorParticipant()) {
const roomId = this.contextService.getRoomId();
await this.httpService.endMeeting(roomId);
}
break;
// case WebComponentCommand.TOGGLE_CHAT:
// Toggle chat
// this.panelService.togglePanel(PanelType.CHAT);
// break;
case WebComponentCommand.LEAVE_ROOM:
// Leave room.
await this.openviduService.disconnectRoom();
break;
default:
break;
}
}
} }