时间戳

首页 > 解决方案 > 具有动态会话和令牌 ID 的 Angular6 基本视频聊天

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

问题描述

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

这里的 in Angular-Basic-Video-Chat\src\config.ts>> 我们需要提到 session 和 token 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.');
});

请帮我解决这个问题。

标签： angulartypescriptopentok

解决方案

示例应用程序有 2 种不同的方式来加载凭据。一种方法是硬编码 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 中。

推荐阅读