2016-06-30 11 views
0

PeerConnectionを1対1で作成しようとしましたが、呼び出し先のストリームを受信できません。WebRTC呼び出し元が呼び出し先リモートストリームを受信できません

私はライブラリExtJSとadapter.jsを使用しています。それは私のWebRTCオブジェクトです。

Ext.define('MyProject.WebRTC', { 
    mixins: ['Ext.mixin.Observable'], 

    config: { 
     audio: true, 
     video: true, 
     offerToReceiveAudio: true, 
     offerToReceiveVideo: true 
    }, 

    isSupport: false, 
    isBusy: false, 
    contacts: [], 
    stream: null, 
    pc: null, 

    constructor: function (config) { 
     this.mixins.observable.constructor.call(this, config); 

     if (navigator.getUserMedia || 
     navigator.mozGetUserMedia || 
     navigator.webkitGetUserMedia) { 
     Ext.Loader.loadScript({ 
      url: Ext.getResourcePath('vendors/adapter.js'), 
      onLoad: this.onLoadAdapter, 
      scope: this 
     }); 
     app.sync.on('rtc-offer', this.onOffer, this); 
     app.sync.on('rtc-answer', this.onAnswer, this); 
     app.sync.on('rtc-candidate', this.onReceiveCandidate, this); 
     app.sync.on('rtc-close', this.onCloseConnection, this); 
     } 
    }, 

    onLoadAdapter: function() { 
    var me = this; 
    navigator.mediaDevices.getUserMedia({ 
     video: this.getVideo(), 
     audio: this.getAudio() 
    }).then(function(stream) { 
     me.stream = stream; 
     me.isSupport = true; 
    })['catch'](this.onError); 
    }, 

    createLocalPeerConnection: function() { 
    if (this.pc) return true; 

    var me = this; 
    this.pc = new RTCPeerConnection(null); 
    this.pc.addStream(this.stream); 
    this.pc.onicecandidate = function(e) { 
     if (e.candidate) { 
      app.sync.sendWebRTCMessage(me.contacts, e.candidate); 
     } 
    }; 
    this.pc.onaddstream = function (e) { 
     me.onGotRemoteStream(e); 
    }; 
    }, 

    onGotRemoteStream: function (e) { 
    this.fireEvent('gotRemoteStream', e.stream); 
    }, 

    onOffer: function (desc, e) { 
    this.createLocalPeerConnection(); 

    var remoteDesc = new RTCSessionDescription(desc), 
     me = this; 

    this.fireEvent('callFrom', e.srcUser); 

    this.pc.setRemoteDescription(remoteDesc); 
    this.contacts = [e.srcUser]; 

    this.pc.createAnswer().then(function (desc) { 
     me.pc.setLocalDescription(desc); 
     app.sync.sendWebRTCMessage(me.contacts, desc); 
    }, this.onError); 
    }, 

    onAnswer: function (desc) { 
    desc = new RTCSessionDescription(desc); 
    this.pc.setRemoteDescription(desc); 
    }, 

    onReceiveCandidate: function (candidate) { 
    candidate = new RTCIceCandidate(candidate); 
    this.pc.addIceCandidate(candidate).then(Ext.emptyFn, this.onError); 
    }, 

    close: function() { 
    app.sync.sendWebRTCMessage(this.contacts, {type: 'close'}); 
    }, 

    onCloseConnection: function() { 
    this.pc.close(); 
    this.pc = null; 
    this.isBusy = false; 
    this.fireEvent('closeConnection'); 
    }, 

    createCall: function (uid, callback, scope) { 
    if (this.isBusy) return; 

    this.isCalling = true; 
    this.createLocalPeerConnection(); 
    this.contacts = [uid]; 

    var me = this; 
    this.pc.createOffer({ 
     offerToReceiveAudio: this.getOfferToReceiveAudio, 
     offerToReceiveVideo: this.getOfferToReceiveVideo 
    }).then(function (desc) { 
     me.pc.setLocalDescription(desc); 
     app.sync.sendWebRTCMessage(me.contacts, desc); 
     if (callback) callback.call(scope); 
    }, this.onError); 
    }, 

    onError: function (error) { 
    console.error(error.toString()); 
    } 
}); 

私は理解できません、なぜ、被呼者がメディアストリームを受信したのですか?しかし、発信者は被呼者にメディアストリームを受信できません。私はこのコードだと思う。this.pc.setRemoteDescription(desc);onAnswerメソッドが正しく動作しません。

this.pc.getRemoteStream() []に等しい。

PS:app.sync - シグナリングサーバとの同期を担当するオブジェクトです。

+0

'app.sync'あるクラスのどのような?スコープパラメータを受け入れる 'on'関数はありますか? –

+0

はい。 app.sync 'mixins:['Ext.mixin.Observable']'あまりにも。 –

答えて

0

この問題は修正されました。問題は私が間違っているということでした。

this.pc.createOffer({ 
    offerToReceiveAudio: this.getOfferToReceiveAudio, 
    offerToReceiveVideo: this.getOfferToReceiveVideo 
}).then(function (desc) { 
    me.pc.setLocalDescription(desc); 
    app.sync.sendWebRTCMessage(me.contacts, desc); 
    if (callback) callback.call(scope); 
}, this.onError); 

は次のようになります。

this.pc.createOffer({ 
    offerToReceiveAudio: this.getOfferToReceiveAudio(), 
    offerToReceiveVideo: this.getOfferToReceiveVideo() 
}).then(function (desc) { 
    me.pc.setLocalDescription(desc); 
    app.sync.sendWebRTCMessage(me.contacts, desc); 
    if (callback) callback.call(scope); 
}, this.onError); 
+0

または 'this.pc.createOffer()。then(function(desc){...}、this.onError);'。 APIの約束バージョンは新しいブラウザでも動作するはずですので、古いコールバックバージョンは推奨されていませんので、それを使用してください。 – jib

+0

両サイドが同じ種類のメディアを送信しているときは、 'offerToReceiveVideo'などは必要ありません。問題は 'this.getOfferToReceiveVideo'が' undefined'ですか? – jib

+0

はい、そうです。私の間違いは、私はこのゲッターを関数としてもプロパティとしても使わなかったということでした。先端に感謝します。しかし、this.getOfferToReceiveVideo()は、ExtJSのスタンダードゲッターであるため、未定義にすることはできません。これは自動的にconfig json 'config:{... something config options ...}'から自動的に生成されます。私の設定は、WebRTCオブジェクトのbeginで定義されています。 –

関連する問題