fakeMediaDevices.getFakeMedia
Github
English Version
1. 默认音频流+视频流
const fakeMedia = fakeMediaDevices.getFakeMedia({
audio: true,
video: true,
})
const fakeMediaStream = new MediaStream([fakeMedia.audio.track, fakeMedia.video.track])
document.getElementById("video-default").srcObject = fakeMediaStream
2. 双声道音频流+指定宽高、帧率的视频流。其中右声道指定音量,并伴有噪声
const fakeMedia = fakeMediaDevices.getFakeMedia({
audio: {
channelCount: 2,
left: {
data: "bbdbbjyy",
loop: true,
gain: 1,
},
right: {
data: "mmdmmjwp",
loop: true,
gain: 0.5,
noise: {
gain: 0.05,
},
},
},
video: {
width: 1024,
height: 768,
frameRate: 15,
},
})
const fakeMediaStream = new MediaStream([fakeMedia.audio.track, fakeMedia.video.track])
document.getElementById("video-stereo").srcObject = fakeMediaStream
3. 背景替换
const bgImg = new Image()
bgImg.src = "./assets/img/mountain.jpeg"
document.getElementById("play-btn-background").onclick = async ()=>{
const fakeMedia = fakeMediaDevices.getFakeMedia({
audio: true,
video: {
type: "background",
bgImg,
},
})
const fakeMediaStream = new MediaStream([fakeMedia.audio.track, fakeMedia.video.track])
document.getElementById("video-background").srcObject = fakeMediaStream
}
4. 随机颜色
document.getElementById("play-btn-random").onclick = async ()=>{
const fakeMedia = fakeMediaDevices.getFakeMedia({
audio: false,
video: {
type: "randomcolor",
bgImg,
},
})
const fakeMediaStream = new MediaStream([fakeMedia.video.track])
document.getElementById("video-randomcolor").srcObject = fakeMediaStream
}
5. 默认视频流+互相抵消的双声道正弦波
const fakeMedia = fakeMediaDevices.getFakeMedia({
audio: {
type: "oscstereo",
},
video: true,
})
const fakeMediaStream = new MediaStream([fakeMedia.audio.track, fakeMedia.video.track])
document.getElementById("video-oscstereo").srcObject = fakeMediaStream