Allow WebRTC webcam request using when QtWebEngine?

Question

How do I allow WebRTC webcam request using when QtWebEngine (when using QML plugin or not)?

webengine.qml

import QtQuick 2.1
import QtQuick.Controls 1.1
import QtWebEngine 1.0

ApplicationWindow {
    width: 800
    height: 600
    color: "lightgray"
    visible: true
    WebEngineView {
        id: webview
        url: "https://opentokrtc.com/test"
        anchors.fill: parent
    }
}

On my Mac Yosemite, running the command:

/usr/local/Cellar/qt5/5.4.0/bin/qmlscene webengine.qml 

but the video won't start because it's waiting for "Allow" camera

On a browser you'd have this

Is there a way to programatically set Chromium Web Engine policy e.g. VideoCaptureAllowed

Answer 1

open fancybrowser project add in mainwindow.cpp inside function MainWindow::MainWindow(const QUrl& url)

connect(view->page(), SIGNAL(featurePermissionRequested(QUrl,QWebEnginePage::Feature)),SLOT(test(QUrl,QWebEnginePage::Feature)));

also add

void MainWindow::test(QUrl q, QWebEnginePage::Feature f) {
    view->page()->setFeaturePermission(q, f, 
    QWebEnginePage::PermissionGrantedByUser); 
}

in mainwindow.cpp and mainwindow.h below

protected slots:

void test(QUrl q, QWebEnginePage::Feature f);

then it all works!!

Answer 2

Add this to your WebEngineView item to grant from all origins any requested feature, or optionally limit it to specific origins and specific features:

    onFeaturePermissionRequested: {
        grantFeaturePermission(securityOrigin, feature, true);
    }

Answer 3

You need use QtWebEngine.experimental Please try this.

import QtQuick 2.4
import QtQuick.Window 2.2
import QtWebEngine 1.0
import QtWebEngine.experimental 1.0
import QtQuick.Controls 1.2
import QtQuick.Controls.Styles 1.2
import QtQuick.Layouts 1.1
import QtQuick.Controls.Private 1.0

Window {
    visible: true
    WebEngineView {
        id: webEngineView
        url: "https://test.webrtc.org/"
        anchors.fill: parent
        anchors.margins: 10
        experimental.onFeaturePermissionRequested: {
            console.log("request")
            experimental.grantFeaturePermission(securityOrigin, feature, true);
        }

        readonly property string hideElementsJS: "
            function hideElement(id) {
                const el = document.getElementById(id);
                if (el) {
                    el.style.display = 'none';
                }
            }

            function hideElementsByClass(className) {
                const elList = document.getElementsByClassName(className);
                for (var i = 0, n = elList.length; i < n; ++i) {
                    elList[i].style.display = 'none';
                }
            }

            hideElement('hnArea');
            hideElement('lxSocialBarWrapper');
            hideElement('footerContent');
            hideElement('ftDisclaimers');
            hideElement('bottomNav');
            hideElement('topLinks');
            hideElement('rightMenuButtons');

            hideElementsByClass('footerText');
            hideElementsByClass('disclaimers');
        "

        onLoadingChanged: {
            if(loadRequest.status === WebEngineView.LoadSucceededStatus) {
                console.log("start")
                runJavaScript(hideElementsJS);
                console.log("stop")
            }
        }
    }
}