一、麦克风获取音频
if (!navigator.mediaDevices.getUserMedia) {
ElMessage.error("浏览器不支持音频输入!");
} else {
navigator.mediaDevices
.getUserMedia(constraints)
.then(async (mediaStream: any) => {
let strem = mediaStream;//音频信息,视频同理
})
.catch((error) => {
switch (error.message || error.name) {
case "PERMISSION_DENIED":
case "PermissionDeniedError":
ElMessage.error("用户拒绝提供信息!");
break;
case "NOT_SUPPORTED_ERROR":
case "NotSupportedError":
ElMessage.error("浏览器不支持硬件设备!");
break;
case "MANDATORY_UNSATISFIED_ERROR":
case "MandatoryUnsatisfiedError":
ElMessage.error("无法发现指定的硬件设备!");
break;
default:
ElMessage.error("无法打开麦克风。异常信息:" + (error.code || error.name));
break;
}
});
}
二、实例化一个webRtc对象,并将音频信息添加进去
pc = new RTCPeerConnection();
pc.addTransceiver("audio", { direction: "sendonly" });
mediaStream.getTracks().forEach((track: MediaStreamTrack) => {
pc.addTrack(track, mediaStream);
});
三、发送webRtc请求
const offer = await pc.createOffer();
pc.setLocalDescription(offer);
四、使用信令服务器进行媒体流传输
// 连接信令服务器中转
const { data: resp } = await axios({
method: "post",
url: "",
data: {
api: "",
clientip: null,
streamurl: ``,
sdp: offer.sdp /、信息
}
});