Ein Quiz für deine Website

Du willst auf deiner Website festhalten, dass jemand das Quiz geschafft hat – zum Beispiel um eine Lektion abzuhaken oder Punkte zu vergeben? Dann lässt du dir das Ergebnis von Qwissit bestätigen. So kann es niemand vortäuschen.

So läuft es ab

1. Deine Seite gibt dem Quiz einen Einmal-Code mit, den sie sich merkt.
2. Der Besucher löst das Quiz. Qwissit prüft jede Antwort selbst; falsch beantwortete Fragen kommen noch einmal, bis alle richtig sind.
3. Am Ende bekommt deine Seite einen Nachweis, den nur Qwissit ausstellen kann, und schickt ihn an deinen Server.
4. Dein Server fragt bei Qwissit nach, ob der Nachweis echt ist und zu deinem Code und Quiz passt. Erst dann speichert er das Ergebnis.

Was du einbaust

Zwei Stellen, beide in PHP. Deine Besucher müssen angemeldet sein (Session), denn das Ergebnis soll ja jemandem zugeordnet werden.

A) Auf der Seite mit dem Quiz: Dieser Block ersetzt das normale Snippet. Passe data-set und data-course an dein Quiz an – die Werte stehen im Code oben.

<?php
session_start();   // your visitors are signed in
$nonce = $_SESSION['quiz_nonce']['http'] ??= rtrim(strtr(base64_encode(random_bytes(16)), '+/', '-_'), '=');
?>
<div id="quiz" data-qwissit-widget data-set="12" data-course="13" data-lang="de"
     data-verify="<?= $nonce ?>"></div>
<script src="https://www.qwissit.com/widget/v1/qwissit-widget.js" async></script>
<script>
document.getElementById('quiz').addEventListener('qwissit:finish', function (e) {
  if (!e.detail.passed || !e.detail.token) return;
  fetch('quiz-complete.php', {
    method: 'POST',
    credentials: 'same-origin',
    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
    body: 'lesson=http&token=' + encodeURIComponent(e.detail.token)
  }).then(function (r) {
    if (r.ok) { /* done: e.g. show a tick */ }
  });
});
</script>

B) Eine neue Datei quiz-complete.php im selben Ordner. Trag bei QUIZZES dieselben Werte für set und course ein und speichere das Ergebnis an der markierten Stelle so, wie es zu deiner Website passt.

<?php
// quiz-complete.php – checks the result with Qwissit and saves it only if everything matches
session_start();
const QUIZZES = ['http' => ['set' => 12, 'course' => 13]];   // same values as data-set / data-course

$lesson = (string)($_POST['lesson'] ?? '');
$token = (string)($_POST['token'] ?? '');
$quiz = QUIZZES[$lesson] ?? null;
$nonce = (string)($_SESSION['quiz_nonce'][$lesson] ?? '');
if (!$quiz || $nonce === '' || $token === '') { http_response_code(400); exit; }

$ch = curl_init('https://www.qwissit.com/widget/v1/verify');
curl_setopt_array($ch, [
    CURLOPT_POST => true,
    CURLOPT_POSTFIELDS => http_build_query(['token' => $token]),
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_TIMEOUT => 4,
]);
$r = json_decode((string)curl_exec($ch), true);
curl_close($ch);

if (!is_array($r)) { http_response_code(503); exit; }   // Qwissit not reachable: save nothing
if (($r['valid'] ?? false) !== true
    || !hash_equals($nonce, (string)($r['nonce'] ?? ''))
    || (int)$r['set'] !== $quiz['set'] || (int)$r['course'] !== $quiz['course']) {
    http_response_code(403); exit;                       // forged, already used, expired or another quiz
}
unset($_SESSION['quiz_nonce'][$lesson]);                 // the code counts only once

// ▶ save the result here, e.g. user + $lesson + date (+ $r['wrong'] = failed attempts)

header('Content-Type: application/json');
echo json_encode(['ok' => true]);

Die Datei speichert nur, wenn Qwissit den Nachweis bestätigt, er zu deinem Einmal-Code gehört und vom richtigen Quiz stammt. Danach ist der Code verbraucht, jedes Ergebnis zählt also nur einmal. Ist Qwissit gerade nicht erreichbar, wird nichts gespeichert – lass den Besucher es später noch einmal versuchen. Der Nachweis gilt eine Stunde.

Gut zu wissen

• Warum der Umweg über deinen Server? Das Widget meldet das Ende des Quiz zwar auch direkt im Browser (Ereignis qwissit:finish), aber das kann jeder mit etwas Technikwissen selbst auslösen. Für eine Anzeige reicht es, für Punkte, Zertifikate oder Freischaltungen nicht.
• Zeig das Quiz mit Einmal-Code nur angemeldeten Besuchern und lege für alle anderen keine Session an – sonst erzeugt jeder Bot eine.
• Schütze quiz-complete.php wie deine anderen Formulare: Anmeldung prüfen, nur Anfragen von deiner eigenen Seite annehmen, Zahl der Anfragen begrenzen.
• Nach einem Erfolg bekommt der Besucher beim nächsten Aufruf einen neuen Code und kann das Quiz wiederholen.
• Zum Testen: Ein ausgedachter Nachweis, derselbe Nachweis ein zweites Mal und der Nachweis eines anderen Quiz müssen abgelehnt werden.