带有动态会话和令牌ID的Angular6基本视频聊天

时间:2018-12-20 06:07:57

标签: angular typescript opentok

我已将基本视频聊天与https://github.com/opentok/opentok-web-samples/tree/master/Angular-Basic-Video-Chat

集成在一起

这里Angular-Basic-Video-Chat\src\config.ts中的>>我们需要提及会话和令牌ID。

在我的页面中,session id and token id值是从firebase返回的。因此,这些值是动态的。如果是这样,我将值传递给服务作为参数。但是更改此设置后,发布者流和订阅者将无法使用。

this.opentokconfigmodel.API_KEY = 'xxxxxxx';
            this.opentokconfigmodel.SESSION_ID = this.meetingsessionid;
            this.opentokconfigmodel.TOKEN = this.meetingtokenid;

this.opentokService.initSession(this.opentokconfigmodel).then((session: OT.Session) => {
  this.session = session;
  this.session.on('streamCreated', (event) => {

    this.streams.push(event.stream);
    this.changeDetectorRef.detectChanges();
  });
  this.session.on('streamDestroyed', (event) => {
    const idx = this.streams.indexOf(event.stream);
    if (idx > -1) {
      this.streams.splice(idx, 1);
      this.changeDetectorRef.detectChanges();
    }
  });
})
.then(() => this.opentokService.connect())
.catch((err) => {
  console.error(err);
  alert('Unable to connect. Make sure you have updated the config.ts file with your OpenTok details.');
});

请帮助我解决此问题。

1 个答案:

答案 0 :(得分:0)

示例应用程序具有两种不同的方式来加载凭据。一种方法是对config.json文件中的值进行硬编码。另一种方法是指定一个URL来加载数据。如果您查看opentok.service.ts,可以看到它在不同情况下如何处理这些情况。

在您的情况下,我将用从Firebase加载数据的逻辑完全替换此逻辑。因此,与其进行提取,不如使用Firebase API加载apiKey,sessionId和令牌,然后返回会话对象。确保在initSession函数中返回Promise。像这样:

initSession() {
 return new Promise((resolve, reject) => {
   // Do your firebase stuff to download the data
   this.session = this.getOT().initSession(firebase.apiKey, firebase.sessionId);
   this.token = firebase.token;
   resolve(this.session);
 });
}

我不确定Firebase API的外观,它可能已经返回了Promise,因此您可能不需要将所有内容包装在Promise中。