https://d226lax1qjow5r.cloudfront.net/blog/blogposts/getting-started-with-advanced-insights/Blog_Advanced-Insights_1200x600.png

Erste Schritte mit Advanced Insights

Zuletzt aktualisiert am April 26, 2021

Lesedauer: 7 Minuten

Greifen Sie mit GraphQL und Advanced Insights auf Ihre Session-Level Video-Daten zu

Sie möchten also mehr Einblicke in die Leistung Ihrer Video-Anwendung erhalten. Vielleicht möchten Sie die Nutzung Ihrer Videoanwendung verfolgen, um zu sehen, wie viele Minuten Ihre Benutzer pro Sitzung verbringen. Oder Sie möchten Qualitätsinformationen analysieren, um das Videoerlebnis Ihrer Kunden besser zu verstehen. Sie haben schon von Advanced Insights gehört, wissen aber nicht, wo Sie anfangen sollen? Dann sind Sie hier genau richtig!

Haben Sie noch keine Advanced Insights? Kontaktieren Sie uns und wir geben Ihnen den Startschuss!

Wir zeigen Ihnen, wie Sie mithilfe von Advanced Insights und GraphQL schnell mit der Abfrage Ihrer Videositzungsdaten beginnen können. In unserem Tutorial verwenden wir das Inspector-Tool als Beispiel und gehen durch, wie Sie die Daten erhalten, die Sie benötigen, um Ihr eigenes benutzerdefiniertes Inspector-ähnliches Dashboard zu erstellen.

In diesem Leitfaden konzentrieren wir uns hauptsächlich auf den Erhalt von Publisher-Bitratendaten, um ein Qualitätsdiagramm für eine bestimmte Sitzung zu erstellen, ähnlich der Komponente Qualitätsmetrik oder Publisher-Details im Video API-Diagnosetool Inspector.

Image showig the bitrate comparison

Am Ende dieses Tutorials werden Sie wissen, wie Sie Advanced Insights-Abfragen erstellen, um alle Daten zu erhalten, die Sie benötigen, um ein Publisher-Bitratendiagramm in einem benutzerdefinierten Dashboard zu erstellen.

Image showing custom dashboard of sample publisher metrics

Möchten Sie zum Ende springen? Sie finden den gesamten Quellcode für dieses Tutorial auf GitHub

Voraussetzungen

In dieser Anleitung wird davon ausgegangen, dass Sie ein Video API-Benutzer mit einem Account sind, der über Nutzungsdaten verfügt. Wenn Sie noch keinen Account haben oder noch nicht mit der Vonage Video API gearbeitet haben, folgen Sie diesen schnellen und einfachen Anleitungen um loszulegen!

Erste Schritte

Advanced Insights basiert auf GraphQL, um Abfragen für den Zugriff auf Ihre Vonage Video API Daten zu erstellen. Machen Sie sich keine Sorgen, wenn Sie mit GraphQL nicht vertraut sind, es ist super einfach, damit anzufangen! Wir haben sogar eine praktische Entwicklungsumgebung zum Testen Ihrer Advanced Insights GraphQL-Abfragen, den Insights GraphiQL-Explorer (beachten Sie das "i" in GraphiQL). Dieser kann direkt von Ihrem Insights Dashboard aus aufgerufen werden.

An image showing the Insights Dashboard

GraphQL

Bevor wir mit Advanced Insights auf Ihre Videodaten zugreifen können, müssen wir zunächst ein wenig verstehen, wie GraphQL funktioniert.

Wenn Sie eine GraphQL-Abfrage stellen, wird diese im Allgemeinen anhand eines GraphQL-Schemas validiert und Sie erhalten eine JSON-ähnliche Antwort. In unserem Fall wird sie anhand unseres Advanced Insights-Schemas validiert.

An image example of GraphQL query on number insights

Ein Schema ist ein Satz von GraphQL-Objekttypen, der beschreibt, nach welchen Daten Sie in der API suchen können. Die Dokumentation zu unserem Insights Schema finden Sie auf der rechten Seite des Insights GraphiQL Explorer.

Ein GraphQL-Objekt wird durch einen Typ und die zugehörigen Felder des Typs definiert.

An image showing the definition of GraphQL objects

Nehmen wir an, Sie möchten den Namen eines bestimmten Helden mit dem folgenden GraphQL-Schema wissen (aus Einführung in GraphQL).

type Query {
	  me: User
    }
type User {
      id: ID
      name: String
    }

Diese hypothetische Anfrage:

{
      me {
        name
      }
    }

würde das folgende JSON ergeben:

{
      “me”: {
        “name”: “Luke Skywalker”
      }
    }

Erweiterte Einblicke und GraphQL

Lassen Sie uns nun mit Advanced Insights und GraphQL auf einige Ihrer Videodaten zugreifen. Für unsere erste Abfrage möchten wir eine Liste von Sitzungs-IDs erhalten.

Zunächst geben wir unsere Projekt-ID an, die den API-Schlüssel Ihres Projekts darstellt.

{
      project(projectId: Your API Key Here) {
        ...
      }
    }

Da wir nun nach unseren Sitzungs-IDs suchen, müssen wir Folgendes verwenden sessionData.

{
      project(projectId: Your API Key Here) {
    	sessionData{
          ...
    	}
      }
    }

Wenn wir unsere Optionen innerhalb von sessionDatasehen möchten, können wir unseren bewährten Schemaexplorer im Insights GraphiQL Explorer verwenden. Die Suche nach sessionData gibt uns die folgenden Ergebnisse:

An image showing the results of searching for session data

Dies sagt uns, dass innerhalb von sessionDataein sessionSummaries Feld angeben, das mindestens ein start Argument benötigt, das durch das ! am Ende des start Typs.

Geben wir in unserer Abfrage ein Startdatum an.

Hinweis: Advanced Insights hat eine Datenaufbewahrungsfrist von 21 Tagen. Sie erhalten eine Fehlermeldung, wenn ein Datum angegeben wird, das älter als die Aufbewahrungsfrist ist. Eine vollständige Liste der Fehler finden Sie hier.

{
      project(projectId: Your API Key Here){
        sessionData{
          sessionSummaries(start: Your timestamp here){  
            ...
          }
        }
      }
    }

Da wir eine Liste von Sitzungskennungen benötigen, müssen wir dies in den Ressourcen innerhalb von sessionSummaries. Um die verfügbaren Ressourcen des Schemas anzuzeigen, navigieren Sie zur sessionData Schema-Seite (suchen Sie einfach nach sessionData), wählen Sie den Typ SessionSummaries! (Typ ist gelb), dann wählen Sie [SessionSummary]! Typ unter "Felder".

An image showing the session summary

Hinweis: Die eckigen Klammern um SessionSummary bedeutet, dass dies eine Liste zurückgeben wird

{
      project(projectId: Your API Key Here){
        sessionData{
          sessionSummaries(start: Your timestamp here){
            resources{
              sessionId
            }
          }
        }
      }
    }

Sie haben nun eine vollständige Abfrage. Kopieren Sie diese und fügen Sie sie in Ihren Insights GraphiQL Explorer ein (stellen Sie sicher, dass Sie in Ihrem Account eingeloggt sind). Vergessen Sie nicht, das Feld projectID Feld mit Ihrem API-Schlüssel auszufüllen und eine Startzeit anzugeben!

Wenn Sie diese Abfrage ausführen, sollten Sie etwa folgendes Ergebnis erhalten.

{
	  "data": {
		"project": {
		  "sessionData": {
			"sessionSummaries": {
			  "resources": [
				{
				  "sessionId": "Your Session ID Here"
				},
				{
				  "sessionId": "Your Session ID Here"
				}
			  ]
			}
		  }
		}
	  }
    }

Wie die Ergebnisse zeigen, sollten wir eine Liste unserer Sitzungs-IDs im JSON-Format erhalten.

Mehr zu Ihrer Anfrage hinzufügen (Optional)

Aus dem Schema können wir ersehen, dass mediaMode ein weiteres Feld ist, das unter SessionSummary. Wir fügen dies zu unserer Abfrage hinzu:

{
      project(projectId: Your API Key Here){
        sessionData{
          sessionSummaries(start: Your timestamp here){
            resources{
              sessionId,
              mediaMode
            }
          }
        }
      }
    }

Rückgabe:

{
	  "data": {
		"project": {
		  "sessionData": {
			"sessionSummaries": {
			  "resources": [
				{
				  "sessionId": "Your Session ID Here",
				  “mediaMode”: “routed”
				},
				{
				  "sessionId": "Your Session ID Here",
				  “mediaMode”: “routed”
				}
			  ]
			}
		  }
		}
	  }
    }

Indem wir unserer Abfrage einfach ein weiteres Feld hinzufügten, konnten wir herausfinden, ob eine Sitzung geroutet oder weitergeleitet und damit eine zusätzliche Informationsebene.

Qualitätsmetriken mit Advanced Insights erhalten

Erstellen der GraphQL-Abfrage

Da Sie nun wissen, wie Sie eine einfache GraphQL-Abfrage erstellen und auf Ihre Videoprojektdaten zugreifen können, beginnen wir mit der Erstellung unserer Abfrage für den Zugriff auf Ihre Videobitrateninformationen.

Zunächst müssen wir herausfinden, welche Daten wir für die Erstellung eines Diagramms der Publisher-Bitrate benötigen. Werfen wir zunächst einen Blick auf das Diagramm in unserem Inspektor-Tool.

An image showing the quality metrics

Um auf dieses Diagramm im Inspektor zugreifen zu können, mussten wir zunächst die ID der Sitzung eingeben, die uns interessiert. Das bedeutet, dass wir unbedingt die Sitzungs-ID in unserer Abfrage. Wir suchen auch nach Herausgeber-Bitrate also müssen wir diese wahrscheinlich auch angeben. Die Qualität ist nach einzelnen Streams getrennt (jede Linienfarbe im Inspector-Diagramm steht für einen anderen Stream), daher benötigen wir eine Möglichkeit, die Bitrate nach Stream. Und schließlich, aber am wichtigsten, wissen wir, dass wir auf eine Form von Bitrate-Daten. In Advanced Insights werden die Bitrateninformationen unter Stream-Statistik.

Wir haben nun eine allgemeine Vorstellung davon, welche Felder wir benötigen. Mit diesem Wissen können wir mit der Erstellung unserer GraphQL-Abfrage beginnen!

Gleich zu Beginn müssen wir unsere Projekt-ID (auch API-Schlüssel genannt) angeben. Wir verwenden wieder sessionData weil wir Daten auf Sitzungsebene abfragen. Da wir die Sitzung kennen, an der wir interessiert sind, können wir das sessions Feld verwenden. Aus dem Schema wissen wir, dass dieses Feld ein Array von Sitzungs-IDs erfordert. Da wir nur an einer einzigen Sitzung interessiert sind, können wir nur eine einzige Sitzungs-ID eingeben (wenn Sie mehr als eine Sitzungs-ID eingeben, gibt die Abfrage die angegebenen Daten für alle eingegebenen Sitzungen zurück).

Unsere Abfrage sollte wie folgt aussehen:

{
      project(projectId: Your API Key Here){
        sessionData{
          sessions(sessionIds: ["Your Session ID Here"]){
            ...
          }
        }
      }
    }

In Advanced Insights sind unsere Streams nach Meetings gruppiert. Das bedeutet, dass wir in unserer Abfrage Meetings angeben müssen, um an unsere Stream-Daten zu gelangen. Ein Blick auf die verfügbaren Ressourcen für sessions im Schema (Sie müssen auf den gelben Session Typ klicken), können wir sehen meetings als ein verfügbares Feld. Wenn wir uns die Ressourcen für genauer ansehen meetingssehen wir, dass publishers ein Feld unter Besprechungen ist. Perfekt! Wir suchen nach Verlagsdaten, also nehmen wir publishers in unsere Abfrage mit ein.

{
      project(projectId: Your API Key Here){
        sessionData{
          sessions(sessionIds: ["Your Session ID Here"]){
            resources{
              meetings{
	            resources{
                  publishers{
                    ...
                  }
                }
              }
            }
          }
        }
      }
    }

Wir wissen, dass wir versuchen, Informationen auf Stream-Ebene zu erhalten, also lassen Sie uns das publishers Feld. Anhand des Schemas (erkennen Sie hier ein Muster?) können wir sehen, dass publishers ein Feld namens streamStatsCollection. Kommt Ihnen das bekannt vor? Das ist richtig! Unsere Video-Bitratendaten werden unter Stream Statistics gespeichert! Wenn wir uns die Ressourcen unter dem Typ PublisherStreamStatsCollectionsehen, erhalten wir viele verschiedene qualitätsbezogene Felder, auf die wir für unseren Video-Stream zugreifen können. In diesem Leitfaden interessieren wir uns nur für die Video-Bitrate, also fügen wir das Feld videoBitrateKbps zu unserer Abfrage hinzufügen. Um ein Bitratendiagramm zu erstellen, benötigen wir auch eine Zeit, die mit unserer Bitratenmessung verknüpft ist. Fügen wir also das Feld createdAt Feld hinzu, wenn wir schon dabei sind.

Die Abfrage sollte nun wie folgt aussehen:

{
      project(projectId: Your API Key Here){
        sessionData{
          sessions(sessionIds: ["Your Session ID Here"]){
            resources{
              meetings{
    			resources{
                  publishers{
                    resources{
                      streamStatsCollection{
                        resources{
                          videoBitrateKbps,
                          createdAt
                        }
                      }
                    }
                  }
                }
              }
            }
          }
        }
      }
    }

Diese Abfrage reicht aus, um die Video-Bitrate des Herausgebers pro Stream zu ermitteln. Um das Ganze zu verdeutlichen, möchten wir unserer Stream-Qualität wahrscheinlich einen Namen zuweisen. Dazu gehen wir zurück zu den verfügbaren Ressourcen für streamStatsCollection und fügen streamID die sich unter Stream befindet.

{
      project(projectId: Your API Key Here){
        sessionData{
          sessions(sessionIds: ["Your Session ID Here"]){
            resources{
              meetings{
    			resources{
                  publishers{
                    resources{
                      stream{
	                    streamId
                      }
                      streamStatsCollection{
                        resources{
                          videoBitrateKbps,
                          createdAt
                        }
                      }
                    }
                  }
                }
              }
            }
          }
        }
      }
    }

Die Ausführung dieser Abfrage im Insights GraphiQL Explorer sollte in etwa folgendes Ergebnis liefern:

{
      "data": {
        "project": {
    	  "sessionData": {
    	    "sessions": {
    	      "resources": [{
    		    "meetings": {
    		      "resources": [{
    			    "publishers": {
    			      "resources": [{
    				    "stream": {
    					  "streamId": "e70fef65-f107-428b-9c03-02351812654f"
    					  },
    					  "streamStatsCollection": {
    					    "resources": [{
    						  "videoBitrateKbps": 6.61,
    						  "createdAt": "2020-03-22T12:24:05.407Z"
    						},{
    					      "videoBitrateKbps": 7.95,
    					      "createdAt": "2020-03-22T12:24:13.194Z"
    				        },{
    					      "videoBitrateKbps": 8.17,
    					      "createdAt": "2020-03-22T12:24:14.438Z"
    					    },{
    						  "videoBitrateKbps": 7.6,
    					      "createdAt": "2020-03-22T12:24:28.729Z"
    				        }]
    			          }
                        }]
    			      }
    			   }]
    		     }
    		  }]
    		}
          }
        }
      }
    }

Das obige Beispielergebnis ist vereinfacht. Sie könnten mehrere Streams mit einer längeren Liste von videoBitrateKbps Feldern sehen, wenn Sie mehrere Verleger für diese Besprechung und längere Streams haben.

Wir haben nun eine vollständige Abfrage, die uns alle Daten liefert, die wir benötigen, um unsere Publisher-Bitratendiagrammkomponente neu zu erstellen! Sie sind nun bereit, diese GraphQL-Abfrage zu verwenden, um ein interaktives Dashboard wie Inspector zu erstellen!

An image showing the interactive dashboard of publisher bitrate

Um Ihnen den Einstieg zu erleichtern, haben wir eine Beispielanwendung die es Ihnen ermöglicht, nach einer Sitzungs-ID zu suchen und ein Diagramm mit den Publisher-Bitrateninformationen für diese Sitzung zu erhalten. Für dieses Beispiel haben wir das Dashboard mit Apollo und React erstellt. (Psst, wir haben auch einen Blog-Beitrag der Sie durch die Erstellung von GraphQL-Abfragen mit Apollo führt.

Bonus-Abfragen

Da Sie nun wissen, wie Sie eine Advanced Insights-Abfrage erstellen und wie Sie den Schema-Explorer verwenden, um die benötigten Felder zu erhalten, finden Sie hier einige weitere nützliche Abfragen, die Ihnen helfen, Advanced Insights optimal zu nutzen.

Abrufen der gesamten Publisher- und Subscriber-Minuten

{
      project(projectId: Your API Key Here){
        sessionData{
          sessions(sessionIds: ["Your Session ID Here"]){
            resources{
              meetings{
                resources{
    		      publisherMinutes,
                  subscriberMinutes
                }
              }
            }
          }
        }
      }
    }

Abrufen von Video-Paketverlusten und Latenzzeiten bei Teilnehmern

{
      project(projectId: Your API Key Here){
        sessionData{
          sessions(sessionIds: ["Your Session ID Here"]){
            resources{
              meetings{
                resources{
                  subscribers{
                    resources{
                      streamStatsCollection{
                        resources{
                          videoPacketLoss,
                          videoLatencyMs
                        }
                      }
                    }
                  }
                }
              }
            }
          }
        }
      }
    }

Jetzt können Sie Ihre eigenen benutzerdefinierten Abfragen erstellen und mehr darüber erfahren, wie Ihre Kunden Ihre Videoanwendung erleben! Schauen Sie sich unbedingt unsere anderen Dashboard-Anwendungsbeispiel die sowohl Daten auf Projektebene aus Insights als auch Daten auf Sitzungsebene aus Advanced Insights in einem einzigen Dashboard zur Visualisierung der Daten Ihrer Videoanwendungen kombiniert. Die Entwicklerdokumentation zu Insights und Advanced Insights finden Sie hier.

Teilen Sie:

https://a.storyblok.com/f/270183/400x400/760bf82fcd/zining-wang.png
Zining WangVonage Ehemalige

Zining ist ein ehemaliger Produktmanager bei Vonage mit Schwerpunkt auf Entwickler-Tools