AndroidでPeerJSリモートビデオが表示されていないWebRTC

Question

Ionic3を使用してAndroidビデオチャットアプリケーションを構築しています。 ビデオチャットはブラウザの2つのタブ間で完璧に動作しますが、Android搭載デバイスのローカルビデオ（空白のリモートビデオ）のみを表示します。

私は私のindex.htmlでピア・ツー・ピア接続のためにPeerJSを使用してい

：「スタン：stun.l.google.com：19302私はstunServer {URLを使用してい

"}接続のために。私はホームページに表示される機能を使用してい

：http://peerjs.com/ 私の構成サービス：私のピアのWebRTCサービスの

import {Injectable} from '@angular/core'; 

@Injectable() 
export class WebRTCConfig { 

peerServerPort: number = 9000; 

key:string = '<my peer id>'; 

stun: string = 'stun.l.google.com:19302'; 

stunServer = { 
    url: 'stun:' + this.stun 
}; 

getPeerJSOption() { 
    return { 
     // Set API key for cloud server (you don't need this if you're running your own. 
     key: this.key, 

     // Set highest debug level (log everything!). 
     debug: 3, 
     // Set it to false because of: 
     // > PeerJS: ERROR Error: The cloud server currently does not support HTTPS. 
     // > Please run your own PeerServer to use HTTPS. 
     secure: false, 

     config: { 
      iceServers: [ 
       this.stunServer/*, 
       this.turnServer*/ 
      ] 
     } 
    }; 
} 

/**********************/ 



audio: boolean = true; 
    video: boolean = false; 

    getMediaStreamConstraints(): MediaStreamConstraints { 
     return <MediaStreamConstraints> { 
      audio: this.audio, 
      video: this.video 
     } 
    } 
} 

スニペット：私のchat.tsで

createPeer(userId: string = '') { 
    // Create the Peer object where we create and receive connections. 
    this._peer = new Peer(/*userId,*/ this.config.getPeerJSOption()); 
    setTimeout(()=> { 
     console.log(this._peer.id); 
     this.myid = this._peer.id; 
    }, 3000) 
} 

myCallId() { 
    return this.myid; 
} 

answer(call) { 
    call.answer(this._localStream); 
    this._step2(call); 
} 

init(myEl: HTMLMediaElement, otherEl: HTMLMediaElement, onCalling: Function) { 
    this.myEl = myEl; 
    this.otherEl = otherEl; 
    this.onCalling = onCalling; 

    // Receiving a call 
    this._peer.on('call', (call) => { 
     // Answer the call automatically (instead of prompting user) for demo purposes 
     this.answer(call); 

    }); 
    this._peer.on('error', (err) => { 
     console.log(err.message); 
     // Return to step 2 if error occurs 
     if (this.onCalling) { 
      this.onCalling(); 
     } 
     // this._step2(); 
    }); 

    this._step1(); 
} 

call(otherUserId: string) { 
    // Initiate a call! 
    var call = this._peer.call(otherUserId, this._localStream); 

    this._step2(call); 
} 

endCall() { 
    this._existingCall.close(); 
    // this._step2(); 
    if (this.onCalling) { 
     this.onCalling(); 
    } 
} 

private _step1() { 
    // Get audio/video stream 
    navigator.getUserMedia({ audio: true, video: true }, (stream) => { 
     // Set your video displays 
     this.myEl.src = URL.createObjectURL(stream); 

     this._localStream = stream; 
     // this._step2(); 
     if (this.onCalling) { 
      this.onCalling(); 
     } 
    }, (error) => { 
     console.log(error); 
    }); 
} 

private _step2(call) { 
    // Hang up on an existing call if present 
    if (this._existingCall) { 
     this._existingCall.close(); 
    } 

    // Wait for stream on the call, then set peer video display 
    call.on('stream', (stream) => { 
     this.otherEl.src = URL.createObjectURL(stream); 
    }); 

    // UI stuff 
    this._existingCall = call; 
    // $('#their-id').text(call.peer); 
    call.on('close',() => { 
     // this._step2(); 
     if (this.onCalling) { 
      this.onCalling(); 
     } 
    }); 
} 

、Iこれを使用してピアwebrtcサービスから関数を呼び出します。

call() { 
this.webRTCService.call(this.calleeId); 
} 

Answer 1

It's許可問題になる可能性があります。カメラの使用を許可する必要があります。

カメラの許可 - お客様のアプリケーションは、 デバイスカメラの使用を許可する必要があります。

<uses-permission android:name="android.permission.CAMERA" /> 

あなたのコードのいくつかのビットがフォーマットされていない

https://developer.android.com/guide/topics/media/camera.html