Javascript 我们如何使用openTok连接为单个会话生成的不同令牌的视频流

你可以看到我想做什么

我希望通过在一个会话中为所有用户提供单独的令牌来连接这些用户 sessionId，以便他们可以查看彼此的流。但用户只能看到他们的 扫射。我只需要在我的页面上为每个用户分配div，并将令牌连接到任何 特定会话ID。

这是用户只能看到其流的代码

    <script src="http://static.opentok.com/webrtc/v2.0/js/TB.min.js" ></script>
    <script src="https://static.opentok.com/webrtc/v2.0/js/TB.min.js" ></script>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
   <script type="text/javascript">

    var publisher;
    var session;

    var apiKey = "44686132";


    var sessionId = "1_MX40NDY4NjEzMn4xMjcuMC4wLjF-V2VkIE1hciAxOSAyMDo1ODozNyBQRFQgMjAxNH4wLjAzMTA3MTAwN34";
    var token = document.getElementById("<%= hdn1.ClientID %>").value;


    publisher = TB.initPublisher(apiKey);

    session = TB.initSession(sessionId);

    session.connect(apiKey, token);
    session.addEventListener("sessionConnected",
                           sessionConnectedHandler);


    session.addEventListener("streamCreated",
                           streamCreatedHandler);


    function sessionConnectedHandler(event) {
        alert("sessionConnectedHandler");


        subscribeToStreams(event.streams);
        session.publish(publisher);

    }
        function subscribeToStreams(streams) {

                if (stream.connection.connectionId
               != session.connection.connectionId) {
                    //var streams = event.streams;
                    for (var i = 0; i < streams.length; i++) {
                        var stream = streams[i];

                        var newDivId = "streams" + stream[i].streamId;
                        var newDiv = $('<div />', { id: newDivId });
                        $('body').append(newDiv);
                        if (stream.connection.connectionId
               != session.connection.connectionId) {
                            session.subscribe(stream[i], newDivId);
                        }

                }
            }
        }
        function streamCreatedHandler(event) {
            subscribeToStreams(event.streams);

        }

</script>

var出版商；
var会议；
var apiKey=“44686132”；
var sessionId=“1_MX40NDY4NjEzMn4xMjcuMC4wLjF-V2VkIE1hciAxOSAyMDo1ODozNyBQRFQgMjAxNH4wLjAzMTA3MTAwN34”；
var token=document.getElementById（“”）值；
publisher=TB.initPublisher（apiKey）；
session=TB.initSession（sessionId）；
连接（apiKey、令牌）；
session.addEventListener（“sessionConnected”，
sessionConnectedHandler）；
session.addEventListener（“streamCreated”，
Stream（Dhandler）；
函数sessionConnectedHandler（事件）{
警报（“sessionConnectedHandler”）；
subscribeToStreams（event.streams）；
出版（出版商）；
}
函数subscribeToStreams（streams）{
if（stream.connection.connectionId
！=会话.连接.连接ID）{
//var streams=event.streams；
对于（变量i=0；i

您的会话和发布者对象超出了其他方法的范围，您可能会遇到错误。如果在方法a（）之外定义会话和发布者变量，一切都将按预期工作

<script type="text/javascript">
  var session, publisher;

  function sessionConnectedHandler(event)...
  ...

var会话，发布者；
函数sessionConnectedHandler（事件）。。。
...

var出版商；
var会议；
var apiKey=“44686132”；
var sessionId=“1_MX40NDY4NjEzMn4xMjcuMC4wLjF-V2VkIE1hciAxOSAyMDo1ODozNyBQRFQgMjAxNH4wLjAzMTA3MTAwN34”；
var token=document.getElementById（“”）值；
publisher=TB.initPublisher（apiKey）；
session=TB.initSession（apiKey，sessionId）；
$.post（'生成令牌url'，数据）
.success（函数（数据、状态、标题、配置）{
会话.connect（data.token，函数（错误）{
如果（错误）
{
}
});
});
session.addEventListener（“sessionConnected”，
sessionConnectedHandler）；
session.addEventListener（“streamCreated”，
Stream（Dhandler）；
函数sessionConnectedHandler（事件）{
警报（“sessionConnectedHandler”）；
subscribeToStreams（event.streams）；
出版（出版商）；
}
函数subscribeToStreams（streams）{
if（stream.connection.connectionId
！=会话.连接.连接ID）{
//var streams=event.streams；
对于（变量i=0；i

当您希望使用不同的令牌连接到信号会话时，每次新建时生成令牌

---

这段代码将对你有所帮助。

我也尝试过这种方式，但只看到了自流……我该怎么办

<script src="http://static.opentok.com/webrtc/v2.0/js/TB.min.js" ></script>
<script src="https://static.opentok.com/webrtc/v2.0/js/TB.min.js" ></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script type="text/javascript">

var publisher;
var session;

var apiKey = "44686132";


var sessionId = "1_MX40NDY4NjEzMn4xMjcuMC4wLjF-V2VkIE1hciAxOSAyMDo1ODozNyBQRFQgMjAxNH4wLjAzMTA3MTAwN34";

var token = document.getElementById("<%= hdn1.ClientID %>").value;


publisher = TB.initPublisher(apiKey);

session = TB.initSession(apiKey,sessionId);
  $.post('generate token url', data)
                .success(function (data, status, headers, config) {

                    session.connect(data.token, function (error) {
                        if (error) 
                        {

                        }
                        });
                    });

session.addEventListener("sessionConnected",
                       sessionConnectedHandler);


session.addEventListener("streamCreated",
                       streamCreatedHandler);


function sessionConnectedHandler(event) {
    alert("sessionConnectedHandler");


    subscribeToStreams(event.streams);
    session.publish(publisher);

}
    function subscribeToStreams(streams) {

            if (stream.connection.connectionId
           != session.connection.connectionId) {
                //var streams = event.streams;
                for (var i = 0; i < streams.length; i++) {
                    var stream = streams[i];

                    var newDivId = "streams" + stream[i].streamId;
                    var newDiv = $('<div />', { id: newDivId });
                    $('body').append(newDiv);
                    if (stream.connection.connectionId
           != session.connection.connectionId) {
                        session.subscribe(stream[i], newDivId);
                    }

            }
        }
    }
    function streamCreatedHandler(event) {
        subscribeToStreams(event.streams);

    }