如何解决带有 Agora-Rtc-SDK 的 Ionic 应用程序 - 流播放问题
我正在尝试在离子应用程序 PWA 中使用 agora-rtc-sdk 进行一些实验。 实际上,我使用的是 3.5.2 版 sdk(版本 4 在 npm 上不可用)。
似乎一切正常(流开始、加入等)我在 play() 函数上遇到了问题。 Play 函数采用 DOM id 来构建本地播放器以显示流,但在 angular 内部使用它不起作用。还有另一种方法可以将流附加到视频元素吗?
谢谢 弗拉维奥
解决方法
使用 Agora Web 3.x SDK,非常有可能获取流并自己手动创建视频元素。
使用 stream-subscribed
回调创建新的 <video/>
对象并将流连接为源。您必须先为 onloadmetadata
添加一个事件侦听器,然后才能调用 play()
。
// connect remote streams
client.on('stream-subscribed',(evt) => {
const remoteStream = evt.stream;
const remoteId = remoteStream.getId();
console.log('Successfully subscribed to remote stream: ' + remoteId);
// create video element
var video = document.createElement('video');
video.id = 'agoraVideo-' + remoteId;
video.setAttribute('webkit-playsinline','webkit-playsinline');
video.setAttribute('playsinline','playsinline');
console.log(video);
video.srcObject = remoteStream.stream;// add video stream to video element as source
video.onloadedmetadata = () => {
// ready to play video
video.play();
}
// Add video element to the DOM
});
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。