jitsi iframe capturelargevideoscreenshot返回空图像

gj3fmq9x  于 2021-09-13  发布在  Java
关注(0)|答案(0)|浏览(224)

你好,我一直在努力学习jitsi。在我研究的一个特定部分,我必须截屏并在img对象上显示它。但不幸的是,我无法做到这一点。如果你们能帮助我,我将不胜感激。这对我来说至关重要。
先谢谢你
这就是我想在其中展示的img对象

var image = document.createElement('img');

    image.src=url;

    image.width=1000;
    image.height=1000;
    image.alt="here should be some image";

    document.body.appendChild(image);
    });

下面是代码块:
myapp1js

function StartMeeting(){
    const domain = 'meet.jit.si';
    const options = {
        roomName: 'alper2323',
        width: 700,
        height: 700,
        parentNode: document.querySelector('#jitsi-meet-conf-container')
    };
    apiObj = new JitsiMeetExternalAPI(domain, options);
}
function HangupCall(){
    apiObj.captureLargeVideoScreenshot().then(data => {
    // data is an Object with only one param, dataURL
    data.dataURL = "data:image/png;base64,iVBORw0KalpoAAAANSUhEUgAABQAA"

    var blob = new Blob([data.dataURL], {type: "image/png"}),

    url = URL.createObjectURL(blob),
    img = new Image();

    img.onload = function() {
        URL.revokeObjectURL(this.src);     // clean-up memory
        document.body.appendChild(this);   // add image to DOM
    }
    alert(url);

    var image = document.createElement('img');

    image.src=url;

    image.width=1000;
    image.height=1000;
    image.alt="here should be some image";

    document.body.appendChild(image);
    });
}

jitsitest.html

<html>
    <head>
        <style>
            .container {
                position: relative;;
                width: 1080px;
                height:720px;
                border:1px red  solid;
            }
        </style>
        <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
        <script src="https://meet.jit.si//external_api.js"></script>
        <script src="myapp1.js"></script>

        <script>
            $(function(){
                $('#btnStart').on('click',function(){
                    StartMeeting();
                });
                $('#btnHangup').on('click',function(){
                    HangupCall(); 
                });
            });

        </script>
    </head>
    <body>

        <button id='btnStart'>Start</button>
        <div class="container">
            <div class="toolbox">
                <button id='btnHangup'>Hangup</button>
            </div>
            <div id='jitsi-meet-conf-container'></div>
        </div>
        <div class="container">
            <div id='jitsi-meet-conf-container'></div>
        </div>
    </body>
</html>

myapp.js

var apiObj = null;

function StartMeeting()
{
    const domain = 'meet.jit.si';
    const options = {
        roomName: 'AlperRoom',
        width: '100%',
        height: '100%',
        parentNode: document.querySelector('#jitsi-meet-conf-container'),
        userInfo: {
            displayName: 'Alper SARAÇ'
        },
        configOverwrite:{

        },
        interfaceConfigOverwrite: {
            DISPLAY_WELCOME_PAGE_CONTENT: false,
            TOOLBAR_BUTTONS: [
                'microphone', 'camera'
            ],
        },
        onload: function () {
            alert('loaded');
        }
    };

    apiObj = new JitsiMeetExternalAPI(domain, options);

    apiObj.addEventListeners({
        readyToClose: function () {
            alert('going to close');
            $("#jitsi-meet-conf-container").empty();
        }
    });

    apiObj.executeCommand('subject', '');
}

function HangupCall(){
    apiObj.executeCommand('hangup');
}

暂无答案!

目前还没有任何答案,快来回答吧!

相关问题