打开相机计数 twilio 参与者

Count twilio participants with camera on

我正在尝试限制允许在一个房间内使用摄像头的用户(最多 9 个),因此我想在达到限制后为所有用户禁用摄像头按钮。但我目前无法确定当前打开相机的用户数量。我在 Twilio API 中搜索了有关房间和参与者的信息 API,但无法在其中找到答案。

有没有一种简单的方法可以用来确定单个房间中打开摄像头的用户数量?一旦我能够确定这一点,我就可以将其用于 enable/disable 其他用户的相机按钮。我正在使用 JavaScript SDK,我的应用程序基于 https://github.com/twilio/twilio-video-app-react.

这里是 Twilio 开发人员布道者。

不同的设备和不同的操作系统在同时请求同一设备方面会有不同的能力。

听起来您想确定谁打开了相机,然后您可以将它们相加。 getUserMedia 当浏览器尝试访问网络摄像头但它已被使用时抛出 NotReadableError(这在所有浏览器/OS 中不一致。)

您可以使用新的基于 promise 的 getUserMedia() 来处理该错误,查看网络摄像头何时已在使用中。

// both the video and audio track set to false to immediately trigger TypeError
var constraints = {
    video: false,
    audio: false
}
navigator.mediaDevices.getUserMedia(constraints).then(function success(stream) {
    /* do stuff */
}).catch(function(err) {
    //log to console first 
    console.log(err); /* handle the error */
    if (err.name == "NotReadableError" || err.name == "TrackStartError") {
        //webcam or mic are already in use 
    } else {
        //other errors 
    }
});

或者,您似乎可以检查 readystate 是否设置为 live--:

navigator.getUserMedia = (navigator.getUserMedia ||
  navigator.webkitGetUserMedia ||
  navigator.mozGetUserMedia ||
  navigator.msGetUserMedia);

if (navigator.getUserMedia) {
  navigator.getUserMedia({
      audio: true,
      video: true
    },
    function(stream) {
      // returns true if any tracks have active state of true
      var result = stream.getVideoTracks().some(function(track) {
        return track.enabled && track.readyState === 'live';
      });

      if (result) {
        alert('Your webcam is busy!');
      } else {
        alert('Not busy');
      }
    },
    function(e) {
      alert("Error: " + e.name);
    });
}

同样,您可以使用 video.onplaying 来检测视频何时开启--

要停止曲目,您可以这样做

stream.getTracks().forEach(track => track.stop())

如果有帮助请告诉我!

因为我无法找到使用 javascript/react 的解决方案,我决定从使用旧 Laravel 版本 (4.2) 的后端解决它。我创建了一条路线,只要有人加入房间或转动 on/off 他们的相机,所有参与者都会呼叫该路线:

// routes.php
Route::get('room/{name}/participants/all', function ($name) {
    $twilioConfig = \Config::get('app.twilio.video');
    $twilioApiKey = $twilioConfig['apiKey'];
    $twilioApiSecret = $twilioConfig['apiSecret'];

    $client = new \Twilio\Rest\Client($twilioApiKey, $twilioApiSecret);
    $participants = $client->video->rooms($name)
            ->participants->read(["status" => "connected"]);

    $allParticipants = [];
    $count = count($participants);
    foreach ($participants as $participant) {
        $publishedTracks = $client->video->rooms($name)
            ->participants($participant->sid)
            ->publishedTracks->read();

        $videoOn = false;
        foreach ($publishedTracks as $publishedTrack) {
            if ('video' === $publishedTrack->kind && $publishedTrack->enabled) {
                $videoOn = true;
                break;
            }
        }
        
        $format = 'H:i:s';
        $allParticipants[$participant->sid] = [
            'identity' => $participant->identity,
            'created' => $participant->dateCreated->format($format),
            'updated' => $participant->dateUpdated->format($format),
            'started' => $participant->startTime->format($format),
            'videoOn' => $videoOn,
            'order' => $count--,
        ];
    }

    return \Illuminate\Support\Facades\Response::json($allParticipants);
});

顺序设置为降序,因为这是我从每个房间的 Twilio 参与者列表中得到的响应(最后加入的参与者在前),这对我来说无关紧要,因为它可以很容易地在前端。

基本上:

  • 获取房间内所有参与者的列表
  • 对于每个参与者,获取它正在发布的所有曲目
    • 特别是获取 video 轨道的状态
  • return React 应用的完整参与者列表

响应如下所示:

[
  {
    "identity": "morcen1@example.com",
    "created": "17:05:17",
    "updated": "17:07:11",
    "started": "17:05:17",
    "videoOn": true,
    "order": 4
  },
  {
    "identity": "morcen2@example.com",
    "created": "17:05:16",
    "updated": "17:07:08",
    "started": "17:05:16",
    "videoOn": true,
    "order": 3
  },
  {
    "identity": "morcen3@example.com",
    "created": "17:05:15",
    "updated": "17:07:04",
    "started": "17:05:15",
    "videoOn": true,
    "order": 2
  },
  {
    "identity": "morcen4@example.com",
    "created": "16:46:32",
    "updated": "17:07:14",
    "started": "16:46:32",
    "videoOn": true,
    "order": 1
  }
]

此脚本还可用于确定 audio 轨道的状态。