如何裁剪视频流

Question

我想在HTML 5或CSS中裁剪实时流，我尝试了很多事情，但仍然无法正常工作。 这是我使用的代码：

    <video id="preview" autoplay></video>
    <script type="text/javascript" src ="https://rawgit.com/schmich/instascan-builds/master/instascan.min.js"></script>
    <script>
        let scanner = new Instascan.Scanner(
        {
            video: document.getElementById('preview'),
            scanPeriod: 1,
            mirror: false,
        });

        scanner.addListener('scan',function(content){
        alert(content);
        window.open(content, "_blank");
        });
        Instascan.Camera.getCameras().then(function (cameras){
            if(cameras.length>0){
                scanner.start(cameras[0]);
            }
            else {
                console.error('No camera found.');
            }
        }).catch(function(e){
            console.error(e);
        });
    </script>

这是Instascan的代码，它是QR码阅读器，这里是我的CSS：

.preview {
    width: 300px;
    height: auto;
    overflow: hidden;
    object-fit: cover;
}

谢谢你，抱歉我的英语水平