如何解决WebEx JS Integration不显示来自主机的视频
我们有一个处理Webex通信的Angular应用程序。 AL1工作正常。要求smarthpone的用户具有microhpone和相机的权限。对话开放,用户发送视频和语音。
问题是宿主。已发送语音,但仅显示视频,然后粘贴了视频。
private connect(): void {
this.webex.meetings.create(this.meetingURL)
.then((meeting) => {
// Call our helper function for binding events to meetings
this.meeting = meeting;
this.bindMeetingEvents(meeting);
this.joinMeeting(meeting);
}).catch((error) => {
// Report the error
console.error('Connection Errors',error);
});
}
private joinMeeting(meeting): void {
meeting.join({ pin: this.meetingPin,moderator: false })
.then(() => {
const mediaSettings = {
receiveVideo: true,receiveAudio: true,receiveShare: true,sendVideo: true,sendAudio: true,sendShare: false,};
// Get our local media stream and add it to the meeting
return meeting.getMediaStreams(mediaSettings).then((mediaStreams) => {
const [localStream,localShare] = mediaStreams;
meeting.addMedia({
localShare,localStream,mediaSettings,});
});
})
.catch((error) => {
this.errorMessage = error;
this.cdr.detectChanges();
});
}
private bindMeetingEvents(meeting) {
meeting.on('error',(err) => {
console.error('Event errors',err);
});
meeting.on('meeting:media:remote:start',() => {
this.isConnecting = false;
this.cdr.detectChanges();
});
meeting.on('meeting:stateChanged',(curr,prev) => {
console.log('currentState',curr);
console.log('prevstate',prev);
});
meeting.on('meeting:self:lobbyWaiting',() => {
console.log('User is guest to space,waiting to be admitted,wait to use addMedia');
});
meeting.on('meeting:self:guestAdmitted',() => {
console.log('Admitted to meeting as guest to call.');
});
meeting.on('meeting:reconnectionStarting',() => {
console.log('reconnecting in progress');
});
meeting.on('meeting:reconnectionSuccess',() => {
console.log('reconnection successful');
});
meeting.on('meeting:reconnectionFailure',() => {
console.log('reconnection failure');
});
// Handle media streams changes to ready state
meeting.on('media:ready',(media) => {
if (!media) {
return;
}
if (media.type === 'remoteVideo') {
const remoteVideo = (document.getElementById('remote-video') as HTMLMediaElement);
remoteVideo.onplaying = () => {
console.log('video playing');
this.isSharing = false;
this.cdr.detectChanges();
};
remoteVideo.srcObject = media.stream;
}
if (media.type === 'remoteAudio') {
(document.getElementById('remote-audio') as any).srcObject = media.stream;
}
if (media.type === 'remoteShare') {
const remoteScreen = (document.getElementById('remote-screen') as HTMLMediaElement);
remoteScreen.onplaying = () => {
this.isSharing = true;
this.cdr.detectChanges();
};
remoteScreen.srcObject = media.stream;
}
});
// Handle media streams stopping
meeting.on('media:stopped',(media) => {
console.log(media);
// Remove media streams
if (media.type === 'local') {
if (!this.meetingalreadyLeaved) {
this.leave(true);
}
}
if (media.type === 'remoteVideo') {
(document.getElementById('remote-video') as HTMLMediaElement).srcObject = null;
}
if (media.type === 'remoteAudio') {
(document.getElementById('remote-audio') as HTMLMediaElement).srcObject = null;
}
if (media.type === 'remoteShare') {
(document.getElementById('remote-screen') as HTMLMediaElement).srcObject = null;
this.isSharing = false;
}
});
}
<ion-content>
<div class="loading-container" *ngIf="isConnecting">
<div *ngIf="!errorMessage" fxLayout="column" fxLayoutAlign="center center" >
<ion-spinner></ion-spinner>
<ion-label>Loading...</ion-label>
</div>
<div *ngIf="errorMessage" fxLayout="column" fxLayoutAlign="center center">
<ion-label>{{errorMessage}}</ion-label>
</div>
</div>
<div fxLayout="column" [fxHide]="isConnecting" style="transform: rotate(-90deg);
transform-origin: left top;
width: 100vh;
overflow-x: hidden;
position: absolute;
top: 100%;
left: 0;">
<div>
<audio id="remote-audio" autoplay></audio>
<video class="remote-user"[fxHide]="isSharing" id="remote-video" autoplay></video>
</div>
<video [fxHide]="!isSharing" class="screen-share" id="remote-screen" muted autoplay playsinline></video>
</div>
<div class="controls" fxLayout="row" fxLayoutAlign="center center" *ngIf="!isConnecting">
<ion-button (click)="leave(false)" color="danger">
<ion-icon name="close-circle-outline"></ion-icon>
</ion-button>
<ion-button (click)="mute()">
<ion-icon *ngIf="!this.isMuted" name="mic"></ion-icon>
<ion-icon *ngIf="this.isMuted" name="mic-off"></ion-icon>
</ion-button>
</div>
</ion-content>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。