区分发起者& Opentok的参与者

时间:2018-01-18 09:55:38

标签: angularjs opentok

我使用Node + Angular创建多个视频聊天。在服务器端创建会话和令牌,并使用它们与客户端中的其他人连接。我在生成令牌时定义了userType。现在,我想要的只是'组织者'将能够发起视频和'用户'只能订阅视频。我可以在订阅者级别上区分它,但不能在发布者中区分它。

这里:streamCreated()运行良好但是sessionConnected()无效,因为我无法将其放入subContainer

var publisher = OT.initPublisher('publisher',{name:'MyGroup'});
// Attach event handlers
        session.on({

          // This function runs when session.connect() asynchronously completes
          sessionConnected: function(event) {
            // Publish the publisher we initialzed earlier (this will trigger 'streamCreated' on other
            // clients)
            if(JSON.parse(session.connection.data).userType === 'organizer'){
                var subContainer = document.createElement('div');
                document.getElementById('initiator-container').appendChild(subContainer);
            }else{

                var subContainer = document.createElement('div');document.getElementById('publisher').appendChild(subContainer);
            }
            session.publish(publisher,subContainer);
          },

          // This function runs when another client publishes a stream (eg. session.publish())
          streamCreated: function(event) {

             // Create a container for a new Subscriber, assign it an id using the streamId, put it inside
              if(JSON.parse(event.stream.connection.data).userType == 'organizer'){
                  // set it as initiator
                // initiator-container
                var subContainer = document.createElement('div');
                subContainer.id = 'stream-' + event.stream.streamId;
                document.getElementById('initiator-container').appendChild(subContainer);
                var subscriberProperties = {height: 486,width:'100%'};
                // Subscribe to the stream that caused this event, put it inside the container we just made
                session.subscribe(event.stream, subContainer,subscriberProperties);
              }else{
                  // participants
                    var subContainer = document.createElement('div');
                    subContainer.id = 'stream-' + event.stream.streamId;
                    document.getElementById('subscribers').appendChild(subContainer);

                    // Subscribe to the stream that caused this event, put it inside the container we just made
                    session.subscribe(event.stream, subContainer);
              }
          },

          streamDestroyed: function(event){
              console.log("Stream " + event.stream.name + " ended. " + event.reason);
          },

          // stream property changed
          streamPropertyChanged: function(event){
              console.log(event)
          }

        });

        // Connect to the Session using the 'apiKey' of the application and a 'token' for permission
        session.connect(token);

任何有可能解决方案的人?

1 个答案:

答案 0 :(得分:0)

我不确定您要做什么,但似乎您希望将发布者和订阅者放在不同的容器中,具体取决于userType在连接数据中的含义。

问题是在session.publish调用中执行此操作,但它实际上是插入发布者的initPublisher调用。我想你想在连接后等待并创建你的发布者,这样你就知道你是什么类型的用户。因此,将initPublisher调用移动到sessionConnected,如下所示:

session.on('streamCreated', function(event) {
  var elementId = JSON.parse(session.connection.data).userType === 'organizer' ? 'publisher' : 'initiator-container';
  var publisher = OT.initPublisher(elementId, {insertMode: 'append'});
  session.publish(publisher);
});

insertMode也是你的朋友。这将使这些元素的插入更容易。