Live-API-Beispiel: Erstellen Sie einen Live-Job

In diesem Beispiel erfahren Sie, wie Sie einen einfachen Live-Job erstellen.

Einleitung

In diesem Beispiel wird ein einfacher Live-Job mit drei Ausgabedarstellungen erstellt: 1080p, 720p und 480p.

Weil die Live API ist nicht CORS-fähig und muss über eine serverseitige App aufgerufen werden. Die API-Anforderung wird über einen einfachen, in PHP geschriebenen Proxy gesendet. Sie können dies in jeder serverseitigen Sprache reproduzieren – es werden lediglich die vom JavaScript gesendeten Anforderungsparameter erfasst, die Anforderung an die API gesendet und die Antwort an das JavaScript zurückgegeben. Alle Codes finden Sie in der Codeabschnitt unten.

Live-Job-App erstellen

Suchen Sie den gesamten Code, der mit diesem Beispiel verknüpft ist, in diesem GitHub-Repository.

Siehe den Stift Live-API-Beispiel: Erstellen Sie einen Live-Job von Brightcove Learning Services (@rcrooks1969) auf CodePen.

CodePen verwenden

Hier sind einige Tipps zur effektiven Verwendung des obigen CodePen:

  • Schalten Sie die aktuelle Anzeige des Players um, indem Sie auf klicken Ergebnis Taste.
  • Drücke den HTML/CSS/JS Tasten, um EINEN der Codetypen anzuzeigen.
  • Klicken Auf CodePen bearbeiten in der oberen rechten Ecke, um diesen CodePen Ihrem eigenen Konto zuzuordnen.
  • Suchen Sie den gesamten Code, der mit diesem Beispiel verknüpft ist, in diesem GitHub-Repository.

Proxy-Code

Zusätzlich zum Code in CodePen (und dem zugehörigen GitHub-Repository) erfordert dieses Beispiel einen Proxy, um die API-Anfrage zu stellen und die Antwort an die App zurückzugeben. Für diese App haben wir PHP verwendet, und der Code ist unten gezeigt. Sie können jede serverseitige Sprache verwenden, um den Proxy zu erstellen.

Proxy-Beispielcode
	<? php
	/**
	 * live-proxy.php - Proxy für Brightcove Live-APIs
	 * stellt die Anfrage und gibt die Antwort zurück
	 * Zugriff auf:
	 * (Beachten Sie, dass Sie * immer * über HTTPS auf den Proxy zugreifen sollten)
	 * Methode: BEITRAG
	 *
	 * @post {string} url - die URL für die API-Anfrage
	 * @post {string} [requestType = GET] - HTTP-Methode für die Anforderung
	 * @post {string} [requestBody] - JSON-Daten, die mit Schreibanforderungen gesendet werden sollen
	 * @post {string} apiKey - Live-API-Schlüssel
	 *
	 * @returns {string} $ response - Von der API empfangene JSON-Antwort
	 * /
	
	
	// CORS-Aktivierung und andere Header
	header („Access-Control-Allow-Origin: *“);
	header („Inhaltstyp: Anwendung/JSON“);
	header („X-Content-Type-Optionen: nosniff“);
	header („X-XSS-Schutz“);
	
	
	$ requestData = json_decode (file_get_contents ('php: // input'));
	
	// API-Aufruf einrichten
	// API-Schlüssel holen
	$ apikey = $ requestData-> apiKey;
	// Anforderungstyp abrufen oder standardmäßig GET
	if ($ requestData-> requestType) {
			$ method = $ requestData-> requestType;
	} sonst {
			$ method = "GET";
	}
	// mehr Sicherheitsüberprüfungen
	$adel = '.io';
	$ endapi = strpos ($ requestData-> url, $ Needle) + 3;
	
	$ nextChar = substr ($ requestData-> url, $ endapi, 1);
	
	if (strpos ($ requestData-> url, 'api.bcovlive.io') == false) {
			exit ('{"ERROR": "Nur Anforderungen an Brightcove Live-APIs werden von diesem Proxy akzeptiert"}');
	} else if ($ nextChar! == '/' && $ nextChar! == '?') {
			exit ('{"ERROR": "Es gab ein Problem mit Ihrer API-Anfrage - bitte überprüfen Sie die URL"} ');
	}
	// URL und Autorisierungsinformationen aus den Formulardaten abrufen
	$ request = $ requestData-> url;
	// Sende die http Anfrage
	if ($ requestData-> requestBody) {
		$ ch = curl_init ($ request);
		curl_setopt_array ($ ch, array (
			CURLOPT_CUSTOMREQUEST => $ method,
			CURLOPT_RETURNTRANSFER => WAHR,
			CURLOPT_SSL_VERIFYPEER => FALSCH,
			CURLOPT_HTTPHEADER => Array (
				'Inhaltstyp: application / json',
				"X-API-KEY: {$ apikey}",
			),
			CURLOPT_POSTFIELDS => $ requestData-> requestBody
		));
		$ response = curl_exec ($ ch);
		curl_close ($ ch);
	} sonst {
		$ ch = curl_init ($ request);
		curl_setopt_array ($ ch, array (
			CURLOPT_CUSTOMREQUEST => $ method,
			CURLOPT_RETURNTRANSFER => WAHR,
			CURLOPT_SSL_VERIFYPEER => FALSCH,
			CURLOPT_HTTPHEADER => Array (
				'Inhaltstyp: application / json',
				"X-API-KEY: {$ apikey}",
			)
		));
		$ response = curl_exec ($ ch);
		curl_close ($ ch);
	}
	
	// Auf Fehler prüfen
	if ($ response === FALSE) {
			$ logEntry = "\\ nFehler: \\ n".
			„\ n“ .date („Y-m-d H:i:S“). „ UTC \\ n "
			. $ response;
			$ logFileLocation = "log.txt";
			$ fileHandle = fopen ($ logFileLocation, 'a') oder die ("- 1");
			fwrite ($ fileHandle, $ logEntry);
			fclose ($ fileHandle);
			echo '{"FEHLER“: "Es gab ein Problem mit Ihrem API-Aufruf"} '+
			die (curl_error ($ ch));
	}
	
	// Dekodiere die Antwort
	// $ responseData = json_decode ($ response, TRUE);
	// Rückgabe der Antwort an den AJAX-Aufrufer
	$ responseDecoded = json_decode ($ response);
	// if (! isset ($ responseDecoded)) {
	//	$antwort = '{null}';
	//}
	echo $ response;
	? >