angularjs - WebRTC remote video stream not working despite having src -


i'm trying make simple angularjs webrtc video chat app based on this tutorial.

i'm able connect connect clients, add streams , play own stream, somehow can't play remote stream.

when check elements can see videoplayer in fact have blob source, won't play it.

can tell me why won't show?

html element: blob src

room controller:

angular.module('publicapp').controller('roomctrl', function ($sce, videostream, $location, $routeparams, $scope, room) {     if (!window.rtcpeerconnection || !navigator.getusermedia) {   $scope.error = 'webrtc not supported browser. can try app chrome , firefox.';   return; }  var stream;  videostream.get() .then(function (s) {   stream = s;   room.init(stream);   stream = url.createobjecturl(stream);   if (!$routeparams.roomid) {     room.createroom()     .then(function (roomid) {       $location.path('/room/' + roomid);     });   } else {     room.joinroom($routeparams.roomid);   } }, function () {   $scope.error = 'no audio/video permissions. please refresh browser , allow audio/video capturing.'; });  $scope.peers = [];  room.on('peer.stream', function (peer) {   console.log('client connected, adding new stream');   $scope.peers.push({     id: peer.id,     stream: url.createobjecturl(peer.stream)   });   console.log($scope.peers); });  room.on('peer.disconnected', function (peer) {   console.log('client disconnected, removing stream');   $scope.peers = $scope.peers.filter(function (p) {     return p.id !== peer.id;   }); });  $scope.getlocalvideo = function () {   return $sce.trustasresourceurl(stream); }; });

room factory:

angular.module('publicapp').factory('room', function ($rootscope, $q, io, config) { var iceconfig = { 'iceservers': [{ 'url': 'stun:stun.l.google.com:19302' }]},     peerconnections = {},     currentid, roomid,     stream;  function getpeerconnection(id) {   if (peerconnections[id]) {     return peerconnections[id];   }   var pc = new rtcpeerconnection(iceconfig);   peerconnections[id] = pc;   pc.addstream(stream);   pc.onicecandidate = function (evnt) {     socket.emit('msg', { by: currentid, to: id, ice: evnt.candidate, type: 'ice' });   };   pc.onaddstream = function (evnt) {     console.log('received new stream');     api.trigger('peer.stream', [{       id: id,       stream: evnt.stream     }]);     if (!$rootscope.$$digest) {       $rootscope.$apply();     }   };   return pc; }  function makeoffer(id) {   var pc = getpeerconnection(id);   pc.createoffer(function (sdp) {     pc.setlocaldescription(sdp);     console.log('creating offer for', id);     socket.emit('msg', { by: currentid, to: id, sdp: sdp, type: 'sdp-offer' });   }, function (e) {     console.log(e);   },   { mandatory: { offertoreceivevideo: true, offertoreceiveaudio: true }}); }  function handlemessage(data) {   var pc = getpeerconnection(data.by);   switch (data.type) {     case 'sdp-offer':       pc.setremotedescription(new rtcsessiondescription(data.sdp), function () {         console.log('setting remote description offer');         pc.createanswer(function (sdp) {           pc.setlocaldescription(sdp);           socket.emit('msg', { by: currentid, to: data.by, sdp: sdp, type: 'sdp-answer' });         });       });       break;     case 'sdp-answer':       pc.setremotedescription(new rtcsessiondescription(data.sdp), function () {         console.log('setting remote description answer');       }, function (e) {         console.error(e);       });       break;     case 'ice':       if (data.ice) {         console.log('adding ice candidates');         pc.addicecandidate(new rtcicecandidate(data.ice));       }       break;   } }  var socket = io.connect(config.signalig_server_url),     connected = false;  function addhandlers(socket) {   socket.on('peer.connected', function (params) {     makeoffer(params.id);   });    socket.on('peer.disconnected', function (data) {     api.trigger('peer.disconnected', [data]);     if (!$rootscope.$$digest) {       $rootscope.$apply();     }   });    socket.on('msg', function (data) {     handlemessage(data);   }); }  var api = {   joinroom: function (r) {     if (!connected) {       socket.emit('init', { room: r }, function (roomid, id) {         currentid = id;         roomid = roomid;       });       connected = true;     }   },   createroom: function () {     var d = $q.defer();     socket.emit('init', null, function (roomid, id) {       d.resolve(roomid);       roomid = roomid;       currentid = id;       connected = true;     });     return d.promise;   },   init: function (s) {     stream = s;   } }; eventemitter.call(api); object.setprototypeof(api, eventemitter.prototype);  addhandlers(socket); return api; });

directive:

angular.module('publicapp').directive('videoplayer', function ($sce) { return {   template: '<div><video ng-src="{{trustsrc()}}" autoplay></video></div>',   restrict: 'e',   replace: true,   scope: {     vidsrc: '@'   },   link: function (scope) {     console.log('initializing video-player');     scope.trustsrc = function () {       if (!scope.vidsrc) {         console.log('no vidsrc found');         return undefined;       }       return $sce.trustasresourceurl(scope.vidsrc);     };   } }; });

room.html:

<div class="video-wrapper">   <video-player class="col-md-4" ng-repeat="peer in peers" vid-src="{{peer.stream}}"></video-player> </div>  <div class="video-wrapper">   <div class="col-md-2">     <video ng-src="{{getlocalvideo()}}" autoplay muted></video>   </div> </div>


Comments

Post a Comment

Popular posts from this blog

inversion of control - Autofac named registration constructor injection -

does autofac support specifying registration name in components' constructors? example: ninject's namedattribute . you need use autofac.extras.attributed package on top achieve this so let's have 1 interface , 2 classes: public interface ihello { string sayhello(); } public class englishhello : ihello { public string sayhello() { return "hello"; } } public class frenchhello : ihello { public string sayhello() { return "bonjour"; } } then have consumer class, in want select instance injected: public class helloconsumer { private readonly ihello helloservice; public helloconsumer([withkey("en")] ihello helloservice) { if (helloservice == null) { throw new argumentnullexception("helloservice"); } this.helloservice = helloservice; } public string sayhello() { return this.helloservice.sayhello()...
Read more

verilog - Systemverilog dynamic casting issues -

i've code snippet following in testbench function void write_to_port( my_data_type_base data ); my_data_type_extended data_ext; if(!$cast(data_ext, data)); `uvm_error(get_type_name(), "failed cast"); `uvm_info(get_name(), $psprintf("data_ext :\n%s", data_ext.sprint()), uvm_medium) // write data_ext out port.... endfunction when run it, i'm getting uvm_error "failed cast." i'm not quire sure why $cast not returning 1. can see, i'm printing out extended class data item after casting uvm_info. can see it's being cast properly. if don't use $cast if condition, don't runtime error. isn't coding practice use if dynamic cast check if $cast returning 1 ? what might reason behind cast not returning 1 in above case? i think semicolon on line 'if' not belong? i think consumes if statement, , uvm_error executes regardless of how if evaluates: if(!$cast(data_ext, data)); <- no semico...
Read more

ios - Change Storyboard View using Seague -

i have following code checks connection server, , depending on want change views if no connection found. nsstring *connect = [nsstring stringwithcontentsofurl:[nsurl urlwithstring:@"http://myserver.com"] encoding:nsutf8stringencoding error:nil]; if (connect == null) { [self performseguewithidentifier:@"network_failure" sender:self]; } else { // other code here } my problem not change views. have added storyboard segue between 2 views identifier of network_failure . not have navigation controller or that, problem? thanks help! no not problem. first of all, in objectivec exists nil object oriented null . must use that. so: if(connect == nil) or better: if(!connect) so due fact nil not same of null , probably code does't enter in if scope . you have been able discover breakpoint. anyway: be sure set trigger segue (line) 2 view controller , , name network_failure (that not best name. should instead view1toview2 ) as, m...
Read more