WebRTC默认使用的编码格式是VP8，我们可以在通话过程中更换编码格式，在 VP9和H264之间切换。更换编码格式不会中断通话，但是需要重新进行ICE协商。

首先在 Web页面增加对编码格式的选择，如下面的代码清单所示。

<div>
选择视频编码格式:
<select id="codecSelect">
	<option value="VP8" selected>VP8</option>
	<option value="VP9">VP9</option>
	<option value="H264">H264</option>
</select>
<input type="button" id="selectCodec" value="选择" onclick="selectCodec() ">
</div>

在通话建立前和通话过程中，我们都可以选择编码格式。点击“选择”将触发调用selectCodec()函数，其实现流程如下面的代码清单所示。

function selectCodec() {
	selectedCodec = document.getElementById("codecSelect").value;
	log("* Select codec: " + selectedCodec);
	
	if (isConnected) {
		pc.restartIce();
	}
}

如果通话连接已经建立，isConnected为true，调用restartlce()函数触发重新协商。

不管是第一次建立连接还是重新协商，都会触发negotiationneeded事件，我们在该事件处理函数 handleNegotiationNeededEvent()中设置编码格式，其实现如代码清单所示。

async function handleNegotiationNeededEvent() {
	log("*** Negotiation needed");
	if (pc.signalingState != "stable") {
		log("-- The connection isn't stable yet; postponing..." )
		return;
	}
	
	const codecCap = getCapabilitiesCodec(selectedCodec);
	try {
		pc.getTransceivers().forEach(t => {
			if(t.sender.track.kind !== 'video') return;
			t.setCodecPreferences(codecCap);
		});
	} catch(err) {
		error("setCodecPreferences error! " + err.name);
	}
	
	try {
		1og("---> Setting local description to the offer");
		await pc.setLocalDescription();
		
		log("---> Sending the offer to the remote peer");
		sendToServer({
			name: myUsername,
			target: targetUsername,
			type: "video-offer",
			sdp: pc.localDescription
		});
	} catch(err) {
		log("*** The following error occurred while handling the negotiationneeded event : ") ;
		reportError(err);
	}
}

对 WebRTC编码格式的设置实际上是一个“建议”，我们将最想使用的编码格式放在一组编码格式的最前面，然后调用setCodecPreferences()方法传入新的数组。

编码格式必须符合当前浏览器的编码能力，我们在getCapabilitiesCodec() 函数中对编码格式进行筛选、排序，如下面的代码清单所示。

function getCapabilitiesCodec(codec) {
	let capCodes = RTCRtpSender.getCapabilities('video').codecs;
	let cap = null;
	switch(codec) {
		case 'VP8':
		case 'VP9':
			cap = capCodes.find(item => item.mimeType.match(codec));
			break;
		case 'H264':
			cap = capCodes.find(item => item.mimeType.match(codec) && item.sdpFmtpLine.match('42e01f'));
			break;
	}
	
	capCodes = capCodes.filter(item => item !== cap);
	capCodes = [cap,...capCodes];
	log("Sorted Capabilities =>" + JSON.stringify(capCodes));
	return capCodes;
}

浏览器往往对同一种编码格式提供多个编码能力，H264编码就是这样，我们在本例中使用了支持CBP配置的编码能力，对应的配置id为42e01f。