Wie kann man die Information, ob der Teilnehmer das Anschalten der Webcam erlaubt hat in das PHP/HTML Skript integrieren?

Question

Hallo!
Wir haben das Erfragen der Webcam Erlaubnis via html eingebettet:

<script>
var video = document.querySelector("#videoElement");
if(navigator.mediaDevices.getUserMedia){
    navigator.mediaDevices.getUserMedia({video:true})}n

Jetzt würden wir aber gerne in Abhängigkeit davon, ob der Teilnehmer die Erlaubnis gab oder nicht, unterschiedliches routing im Fragebogen vornehmen. Ist es möglich, das feedback bezüglich der Erlaubnis vom Browser aufzunehmen?

Ich habe das hier probiert, aber die Verknuepfung mit php code wie z.B. goTo ist mir nicht klar:

<script>
var video = document.querySelector("#videoElement");
if(navigator.mediaDevices.getUserMedia){
    navigator.mediaDevices.getUserMedia({video:true})
    if (navigator.mediaDevices.getUserMedia) {
        navigator.mediaDevices.getUserMedia({ video: true })
       .then(function (stream) {
       video.srcObject = stream;
       })
       .catch(function (err0r) {
       goTo('exit');
});

}n

Answer 1

Jetzt würden wir aber gerne in Abhängigkeit davon, ob der Teilnehmer die Erlaubnis gab oder nicht, unterschiedliches routing im Fragebogen vornehmen.

Es ist nicht ganz trivial ... die Lösung lautet: Promises.

Sehen SIe sich als erstes bitte einmal die JavaScript-Methode
MediaDevices.getUserMedia() an. Diese leifert als Ergebnis ein Promise zurück. Das ist das, weshalb Sie im Code .then() und .catch() verwenden können.

Grob gesprochen können Sie im catch() auf eine Ablehnung der Video-Anfrage reagieren. Und dies können Sie mittels einer internen Variable auch an den Datensatz weitergeben. Sobald Sie es im Datensatz haben, können Sie auf der Folgeseite direkt mittels PHP-Filter darauf reagieren.

Comments

Ah, ja, stimmt, jetzt funktioniert es!!
mit:
option('nextbutton', false);
if(value('IV04_01' == 2){
    goToPage('GB'); }
else{ goToPage('Demo'); }

Vielen Dank!

---

Hallo noch mal,
wir dachten ja, dass das jetzt funktioniert, die webcam Abfrage und dann die webcam weiterlaufen zu lassen, aber wir haben doch wieder zwei Probleme:
1) eine Fehlermeldung auf der Seite mit der Webcam-Aktivierung:
ReferenceError: surveyFrame is not defined
webcam_frame.html:8:21<anonymous> https://www.soscisurvey.de/PDG3/webcam_frame.html:8

und 2) die webcam wird nach positiver Abfrage angeschaltet aber schaltet sich nach einigen Sekunden auf der gleichen Seite wieder aus.

Haben Sie evtl. für diese beiden Probleme noch mal Hinweise?
Vielen Dank!

---

> ReferenceError: surveyFrame is not defined

Fangen wir einmal damit an... Was sagt denn die Fehlerkonsole, wenn Sie direkt unter die Definition der Variable das console.log() schreiben?

var surveyFrame = window.parent.getElementById("survey");
console.log(surveyFrame)

Und vor allem: Kommt der Fehler dann über oder unter dieser Information? Die Variable muss ja erst definiert werden, bevor man sie verwenden kann.

---

Das ist das Output, wenn wir die Zeile hinzufügen:

Als Fehlermeldungen bekommen wir:
[Log] <frame src="https://www.soscisurvey.de/PDG3/" name="survey" id="survey"> (webcam_prompt.html, line 12)

[Error] The top-level frame has prevented a document with a different security origin from calling getUserMedia.
    permission_prompt (webcam_prompt.html:19)
    Global Code (webcam_prompt.html:35)
[Error] Unhandled Promise Rejection: TypeError: null is not an object (evaluating 'input.value = 2')
    (anonymous function) (webcam_prompt.html:29)
    promiseReactionJob
[Log] <frame src="https://www.soscisurvey.de/PDG3/" name="survey" id="survey"> (webcam_prompt.html, line 12)

[Error] The top-level frame has prevented a document with a different security origin from calling getUserMedia.
    permission_prompt (webcam_prompt.html:19)
    Global Code (webcam_prompt.html:35)

---

> The top-level frame has prevented a document with a different security origin from calling getUserMedia.

Hier hat offenbar die Sicherheitsbeschränkung des Browsers zugeschlagen. Allerdings irritiert mich das "a different security origin", denn alle Ressourcen werden von www.soscisurvey.de geladen, oder?

Sie können im Frameset einmal den allow-Parameter ausprobieren: https://bugs.webkit.org/show_bug.cgi?id=182638#c8