在瀏覽器中獲取我的視頻

我使用Twilio API在iPad和筆記本電腦之間創建視頻聊天。在瀏覽器中獲取我的視頻

它適用於iPad：我有2個屏幕（大屏幕包含來自筆記本電腦的視頻，小屏幕包含來自iPad的視頻）。但我在筆記本電腦的瀏覽器中只有一個大屏幕（帶有來自iPad的視頻），而且筆記本電腦的攝像頭視頻沒有小屏幕。

我的代碼：

<!DOCTYPE html> 
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta charset="utf-8" /> 
    <title></title> 
    <script src="http://media.twiliocdn.com/sdk/js/video/v1/twilio-video.min.js"></script> 
</head> 
<body> 
    <script type="text/javascript"> 
     var accessToken = "..." 
     const Video = Twilio.Video; 
     const client = new Video.Client(accessToken); 
     const localMedia = new Video.LocalMedia(); 

     Video.getUserMedia().then(mediaStream => { 
      localMedia.addStream(mediaStream); 
     }); 

     client.connect({ 
      to: 'my-room', 
      localMedia: localMedia 
     }).then(room => { 
      const localParticipant = room.localParticipant;      
      room.participants.forEach(participant => {      
       participant.on('trackAdded', track => { 
        if (track.kind === 'audio') { 
         console.log('Added an AudioTrack %s', track.id); 
        } else { 
         console.log('Added a VideoTrack %s', track.id); 
        } 
       }); 
       participant.on('trackRemoved', track => { 
        if (track.kind === 'audio') { 
         console.log('Removed an AudioTrack %s', track.id); 
        } else { 
         console.log('Removed a VideoTrack %s', track.id); 
        } 
       });  
       participant.on('trackEnabled', track => { 
        if (track.kind === 'audio') { 
         console.log('Enabled AudioTrack %s', track.id); 
        } else { 
         console.log('Enabled VideoTrack %s', track.id); 
        } 
       });  
       participant.on('trackDisabled', track => { 
        if (track.kind === 'audio') { 
         console.log('Disabled AudioTrack %s', track.id); 
        } else { 
         console.log('Disabled VideoTrack %s', track.id); 
        } 
       }); 

       const element = participant.media.attach(); 
       document.body.appendChild(element); 

       participant.media.tracks.forEach(track => { 
        track.attach('#track-view'); 
       }); 
      }); 

      room.once('participantConnected', participant => { 
       console.log('Participant "%s" has connected to the Room', participant.identity); 
      }); 

      room.once('participantDisconnected', participant => {     
       console.log('Participant "%s" has disconnected from Room', participant.identity); 
      }); 

     }, error => { 
      console.error('Failed to connect to the Room', error); 
     }); 
    </script> 
</body> 
</html>

什麼是顯示小屏幕視頻從筆記本電腦在我的筆記本電腦的瀏覽器的最佳方法是什麼？

來源

2017-03-01 Kirill

Twilio開發人員在這裏傳播。

它在我看來好像你沒有將本地媒體附加到任何地方的頁面。你可以嘗試這樣的：

Video.getUserMedia().then(mediaStream => { 
    localMedia.addStream(mediaStream); 
    const element = localMedia.attach(); 
    document.body.appendChild(element); 
});

讓我知道這是否有助於在所有。

來源

2017-03-06 17:08:22 philnash

你好@philnash - 你有幾分鐘的時間來幫助我解決類似的問題嗎？它鏈接在這裏：https://stackoverflow.com/questions/44661361/twilio-programmable-video-js-ionic（我現在很堅持:(） –

在瀏覽器中獲取我的視頻

回答

相關問題