WebRTC与PeerJS远程视频不显示在Android上

Question

我使用Ionic3来构建一个android视频聊天应用程序。 该视频聊天工具在我的浏览器的两个标签之间完美地工作，但只显示我的android设备上的本地视频（远程视频为空）。

我使用PeerJS为对等网络连接在我的index.html：

我使用stunServer {URL：“眩晕：stun.l.google.com：19302 “}为连接。

我使用的主页上显示的功能：http://peerjs.com/ 我的配置服务：

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 
     } 
    } 
} 

摘录我同行的WebRTC服务：

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(); 
     } 
    }); 
} 

在我chat.ts，我使用它从对等webrtc服务调用功能：

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

Answer 1

它是可能是一个许可问题。您需要授予其使用相机的权限。

相机权限 - 您的应用程序必须申请使用 设备相机的权限。

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

见

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