fakeMediaDevices.getFakeMedia

Github

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