https://d226lax1qjow5r.cloudfront.net/blog/blogposts/how-to-build-a-video-moderation-application-with-aws-rekognition/blog_video-api_moderation_1200x600.png

Erstellen einer Video-Moderations-Applikation mit AWS Rekognition

Zuletzt aktualisiert am May 25, 2021

Lesedauer: 3 Minuten

Vor allem im Bildungs- und Veranstaltungsbereich kann das Hinzufügen einer aktiven Moderation für die Videos der Teilnehmer sehr nützlich sein, da sie es ermöglicht, unangemessene Inhalte von anderen zu blockieren. Die Anwendung, die wir mit diesem Tutorial erstellen, ermöglicht es Ihnen auch, Daten während des Anrufs zu speichern und nach dem Anruf eine Analyse der Erkennungsleistung durchzuführen.

In diesem Blog-Beitrag werden wir eine Video-Moderationsanwendung implementieren, die Vonage Video API und AWS Rekognition. Die Anwendung moderiert die Videos, die durch Kamera- und Bildschirmfreigabe für jeden der Herausgeber in der Sitzung veröffentlicht werden. Wenn die Anwendung unangemessene Inhalte erkennt, schaltet sie das Video des betreffenden Anbieters stumm und sendet eine Benachrichtigung an alle Teilnehmer.

Möchten Sie weitermachen? Sie finden den Code für dieses Tutorial auf GitHub und das Video-Tutorial und die Demo auf Youtube

Voraussetzungen

  1. Ein Vonage Video API-Konto. Wenn Sie noch kein Konto haben, können Sie ein Konto auf der Seite Video-Dashboard

  2. Ein AWS-Konto

Projekt Architektur

Schema showing project architectureSchema showing project architecture

Das Anwendungs-Backend wird mit AWS Serverless-Komponenten wie AWS Lambda, AWS API Gateway, AWS DynamoDB und AWS Rekognition Service implementiert.

Das Backend befindet sich im Ordner src/functions. Es gibt zwei Hauptfunktionen:

  • api/room.jsVonage Video API: übernimmt die Erstellung des Raums in DynamoDB und weist dem spezifischen Raumnamen die Vonage Video API sessionId zu.

  • api/moderation.jsAWS Rekognition: empfängt das base64-Bild vom Client, sendet das Bild an den AWS Rekognition Service und sendet das Ergebnis an den Client zurück.

Die Raumfunktion erhält einen Parameter namens roomName. Anhand des Parameters roomNameprüft sie, ob der Raum existiert. Wenn ja, sendet sie die sessionId zurück, der sich auf den bestehenden Raum bezieht, und das Token, um dem Raum beizutreten. Wenn nicht, erstellt es einen neuen Raum sessionIdRaum, speichert ihn in DynamoDB und sendet die Anmeldeinformationen (sessionId und token) zurück.

Die Moderationsfunktion empfängt die Bilder von der client-seitigen Kamera oder der Bildschirmfreigabe. Bevor das Bild an den AWS Rekognition-Server gesendet wird, dekodiert die Funktion es in das base64-Format.

const AWS = require("aws-sdk");
const Rekognition = new AWS.Rekognition();
const config = require("../config.json");

function detectModerationLabels(imageBuffer) {
  var params = {
    Image: {
      Bytes: imageBuffer,
    },
    MinConfidence: Number(config.AWS_REKOGNITION_MIN_CONFIDENCE),
  };
  return Rekognition.detectModerationLabels(params).promise();
}

Dann ruft sie die detectModerationLabels Funktion auf. Die Funktion detectModerationLabels Funktion gibt die erkannten Objekte und das Vertrauen zurück. Wenn keine Objekte erkannt werden, gibt die Funktion ein leeres Array zurück. Andernfalls gibt die Funktion ein Array mit dem erkannten Objekt an die Client-Seite zurück.

Kunden-Seite

Die clientseitige Anwendung ist eine React Single Page Application. Der Einstiegspunkt des Projekts ist die src/client/index.js Datei. Die Indexdatei importiert die App-Datei, die die Routes und die Komponentendefinition enthält.

Seiten

Die Routen werden in der Datei App.js definiert. Der Code verwendet das react-router-dom Modul, um die Routen zu deklarieren. Es gibt zwei Hauptrouten:

  • Warteraum: Auf dieser Seite kann der Benutzer seine Mikrofon- und Kameraeinstellungen vornehmen und einen Test vor dem Anruf durchführen. Dann kann er dem Videoanruf beitreten.

  • Video-Raum: Der Nutzer kann sich mit der Sitzung verbinden, seinen Stream veröffentlichen und jeden Stream im Raum abonnieren.

Das Wichtigste auf der Seite Video Room ist der benutzerdefinierte Haken: useModeration (hooks/useModeration). Der useModeration Hook sendet jede Sekunde einen Screenshot der Kamera (oder des Bildschirms) an die Moderations-API-Funktion.

Für Live-Streaming ist es ideal, einen Prozess zu haben, der regelmäßig Frames extrahiert und die bildbasierte Rekognition-API für die Analyse verwendet. So erhalten Sie die Erkennungsantwort asynchron und können Ihren KI/ML-Prozess in Zukunft erweitern (die meisten maschinellen Lernmodelle basieren auf Bildern). Daher ist das Senden eines Screenshots pro Sekunde ein guter Kompromiss zwischen der Erkennung von Live-Inhalten und der CPU-/Bandbreitennutzung des Clients, der die Videoanwendung verwendet. Um das Bildschirmfoto des Streams zu erhalten, verwendet die Anwendung die Funktion getImgData Funktion, die vom Video SDK bereitgestellt wird.

useInterval(
    () => {
      if (
        currentPublisher &&
        !currentPublisher.isLoading() &&
        currentPublisher.stream &&
        currentPublisher.stream.hasVideo &&
        isModerationActive
      ) {
        sendImage(currentPublisher.getImgData()).then((res) => {
          if (res && res.error) {
            return;
          }
          if (res && res.data && res.data.labels && res.data.labels.length) {
            setModerationLabels(parseModerationLabels(res.data.labels));
            setWarnOpenSnackbar(true);
            setCameraIsInappropriate(res.data.innapropriate);
          }
        });
      }
    },
    isIntervalRunning ? intervalDelay : null
  );

Wenn die Moderationsfunktion unangemessene Inhalte feststellt, zeigt der useModeration Hook eine Warn-Snackbar für den aktuellen Herausgeber und deaktiviert dessen Webcam oder Bildschirm für einen bestimmten Zeitraum (z. B. 10 Sekunden). Der Hook sendet auch ein Signal an die anderen Teilnehmer, das ihnen mitteilt, dass das Video des Herausgebers wegen unangemessener Inhalte deaktiviert wurde.

Schlussfolgerung

In diesem Beitrag wird gezeigt, wie eine API zur Inhaltsmoderation, AWS Rekognition, in die Vonage Video API integriert werden kann. Wie die Anwendung auf unangemessene Inhalte reagiert, ist je nach Anwendungsfall vollständig anpassbar. Sie kann das Audio/Video des Publishers stummschalten oder den Benutzer sogar zwangsweise trennen und ihm die erneute Teilnahme an der Sitzung untersagen.

Weitere Einzelheiten darüber, wie Sie Inhalte mit der Vonage Video API moderieren können, finden Sie in diesem Artikel.

Ressourcen: https://github.com/nexmo-se/video-api-aws-moderation

Teilen Sie:

https://a.storyblok.com/f/270183/400x266/5bd495df3c/enrico-portolan.png
Enrico PortolanGastautor

Enrico ist ein ehemaliges Mitglied des Vonage-Teams. Er arbeitete als Solutions Engineer und unterstützte das Vertriebsteam mit seinem technischen Fachwissen. Er begeistert sich für die Cloud, Startups und neue Technologien. Er ist der Mitbegründer eines WebRTC-Startups in Italien. Außerhalb der Arbeit reist er gerne und probiert so viele verrückte Gerichte wie möglich.