# WebRTC（十三）一对一音视频通话

# 获取媒体信息

function start(){
	if (!navigator.mediaDevices||
		!navigator.mediaDevices.getUserMedia) {
		console.error('the getUserMedia is not supported!');
		return;
	} else {
	
		var constraints={
			video:true,
			audio:true
		}
		navigator.mediaDevices.getUserMedia(constraints)
				 .then(getMediaStream)
				 .catch(handleError)
	}
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

# 本地媒体流显示到localVideo

function getMediaStream(stream){ 
localVideo.srcObject=stream; 
localStream=stream;
}

1
2
3
4

# 创建媒体协商

function call(){
	pc1 = new RTCPeerConnection();
	pc2 = new RTCPeerConnection();
	pc1.onicecandidate=(e)=>{
		pc2.addIceCandidate(e.candidate);
	}
	pc2.onicecandidate=(e)=>{
		pc1.addIceCandidate(e.candidate);
	}
	
	pc2.ontrack=getRemoteStream;
	
	localStream.getTracks().forEach((track)=>{
		pc1.addTrack(track,localStream);
	});
	
	var offerOptions={
		offerToRecieveAudio:1,
		offerToRecieveVideo:1
	}

	pc1.createOffer(offerOptions)
	   .then(getOffer)
	   .catch(handleOfferError);
}

//本地媒体流显示到remoteVideo
function getRemoteStream(e){
	remoteVideo.srcObject = e.streams[0];
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

# 将sdp写入本地1和本地2并创建访问

function getOffer(desc){
	pc1.setLocalDescription(desc);
	
	pc2.setRemoteDescription(desc);
	pc2.createAnswer()
	   .then(getAnswer)
	   .catch(handleAnswerError);
}

1
2
3
4
5
6
7
8

# 将sdp写入本地1和本地2并创建回答

function getAnswer(desc){
	pc2.setLocalDescription(desc);
	pc1.setRemoteDescription(desc);
	
}

1
2
3
4
5

# 挂断

function hangup(){
    pc1.close();
    pc2.close();
    pc1 = null;
    pc2 = null;
  }

1
2
3
4
5
6

← 十二-统计信息