简体   繁体   English

tokbox-opentok仅传递到一侧

[英]tokbox-opentok passed to one side only

I am using tokbox trial for video chatting on my website. 我在网站上使用Tokbox试用版进行视频聊天。 But the problem i am facing is that ::: User 1 can see and hear User 2 clearly. 但是我面临的问题是:::用户1可以清楚地看到和听到用户2。 User 2 can see User 1 clearly, but user 2 couldnt here user 1. And code i am using 用户2可以清楚地看到用户1,但是用户2在这里不能看到用户1。我正在使用的代码

<html>
  <head>
    <title>Monkvyasa | Test</title>
    <script src='http://static.opentok.com/webrtc/v2.2/js/opentok.min.js'></script>
    <script type="text/javascript">
      // Initialize API key, session, and token...
      // Think of a session as a room, and a token as the key to get in to the room
      // Sessions and tokens are generated on your server and passed down to the client
      var apiKey = "xxxxxxx";
      var API_KEY=apiKey;
      var sessionId = "2_MX40NTAyMDgxMn5-xxxxxxxxxxxxxxxxxxxxHBXZEZoWHN-fg";
       var token = "T1==cGFydG5lcl9pZD00NTAyMDgxMiZzaWc9ZDNiYjYyZGE2NTBkYmUzMTUyNGNjNDZjYzAzY2NjZWRhZGY3NTEyZjpyb2xlPW1vZGVyYXRvciZzZXNzaW9uX2lkPTJfTVg0xxxxxxxxxxxxxxxxxxxxxxxxBNM1JsYlRCUFdXWkhSSEJYWkVab1dITi1mZyZjcmVhdGVfdGltZT0xNDEzMjAwMjIxJm5vbmNlPTAuMTk1MzEwNTU0MzY1MjEwNSZleHBpcmVfdGltZT0xNDEzMjg0MzY5";


      // Initialize session, set up event listeners, and connect
        var session;
        var connectionCount = 0;

        function connect() {
            session = TB.initSession(sessionId);
            session.addEventListener("sessionConnected", sessionConnectHandler);
            session.addEventListener('streamCreated', function(event){
                e=event;
                console.log(e);
              for (var i = 0; i < event.streams.length; i++) {
                 streams = event.streams;
                // Make sure we don't subscribe to ourself
                alert("new user connected :)");
                if (streams[i].connection.connectionId == session.connection.connectionId) {
                  return;
                }
                // Create the div to put the subscriber element in to
                var div = document.createElement('div');
                div.setAttribute('id', 'stream' + streams[i].streamId);
                document.body.appendChild(div);
                session.subscribe(streams[i], div.id);
              }
            });

            session.connect(API_KEY, token);

            }

         function sessionConnectHandler(event) {
                var div = document.createElement('div');
                div.setAttribute('id', 'publisher');

                var publisherContainer = document.getElementById('publisherContainer');  
                    // This example assumes that a publisherContainer div exists
                publisherContainer.appendChild(div);

                var publisherProperties = {width: 500, height:450};
                publisher = TB.initPublisher(API_KEY, 'publisher', publisherProperties);
                session.publish(publisher);
            }

        function disconnect() {
          session.disconnect();
        }



        connect();
    </script>
  </head>
  <body>
    <h1>Monkvysa videofeed test!</h1>
    <input style="display:block" type="button" id="disconnectBtn" value="Disconnect" onClick="disconnect()">
    <table>
    <tr>
    <td> <div id="publisherContainer"></div></td> <td><div id="myPublisherDiv"></div></td>
    </tr>
    </table>


  </body>
</html>

Thanks in advance 提前致谢

The code looks mostly correct, except you're using an older form of the 'streamCreated' event handler. 该代码看起来大多数都是正确的,除了您使用的是“ streamCreated”事件处理程序的较旧形式。 In the latest version of the API, you no longer need to iterate through the event.streams array, you actually get one invocation of the event handler per stream. 在最新版本的API中,您不再需要遍历event.streams数组,实际上每个流都可以调用一次事件处理程序。

In order to further dig into the problem, would you be able to add a link to a gist containing all the console logs? 为了进一步探究问题,您是否可以向包含所有控制台日志的要点添加链接? To make sure the logs are being outputted, you can call OT.setLogLevel(OT.DEBUG); 要确保正在输出日志,可以调用OT.setLogLevel(OT.DEBUG); at the beginning of the script. 在脚本的开头。

Lastly, the newer API is greatly simplified and you could save yourself the effort of DOM element creation and iteration. 最后,新的API大大简化了,您可以省去DOM元素创建和迭代的工作。 What you have implemented is basically identical to our Hello World sample applications, which you can find in any of our server SDKs, for example here: https://github.com/opentok/opentok-node/blob/61fb4db35334cd30248362e9b10c0bbf5476c802/sample/HelloWorld/public/js/helloworld.js 您实现的内容基本上与我们的Hello World示例应用程序相同,您可以在我们的任何服务器SDK中找到该示例应用程序,例如: https : //github.com/opentok/opentok-node/blob/61fb4db35334cd30248362e9b10c0bbf5476c802/sample/HelloWorld /public/js/helloworld.js

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM