Experimentieren mit WebTransport

WebTransport ist eine neue API, die bidirektionales Client-Server-Messaging mit geringer Latenz bietet. Erfahren Sie mehr über ihre Anwendungsfälle und wie Sie die Zukunft Ihrer Bereitstellung kommentieren können.

8. Juni 2020
Aktualisiert 10. November 2020

Hintergrund

Was ist QuicTransport?

QuicTransport ist eine Web-API, die verwendet QUIC Protokoll auf einem bidirektionalen Transport, nicht HTTP. Es ist für die Zwei-Wege-Kommunikation zwischen einem Web-Client und einem QUIC-Server ausgelegt. Es unterstützt das unzuverlässige Senden von Daten über seine Datagram-APIs und zuverlässig über seine Streaming-APIs.

Datagramme Sie sind ideal zum Senden und Empfangen von Daten, für die keine strengen Zustellgarantien erforderlich sind. Einzelne Datenpakete sind in der Größe durch die begrenzt maximale Übertragungseinheit (MTU) der zugrunde liegenden Verbindung und können erfolgreich übertragen werden oder nicht, und wenn sie übertragen werden, können sie in einer beliebigen Reihenfolge eintreffen. Diese Funktionen machen Datagram-APIs ideal für die Datenübertragung mit geringer Latenz und bestem Aufwand. Sie können sich Datagramme als vorstellen Benutzerdatagrammprotokoll (UDP) Nachrichten, aber verschlüsselt und überlastungsgesteuert.

Im Gegensatz dazu bieten Streams-APIs vertrauenswürdig, geordnete Datenübertragung. Sie eignen sich sehr gut für Szenarien, in denen Sie einen oder mehrere geordnete Datenströme senden oder empfangen müssen. Die Verwendung verschiedener QUIC-Flows ist analog zur Bestimmung verschiedener TCP Verbindungen, aber QUIC-Flows sind leicht und können ohne großen Aufwand geöffnet und geschlossen werden.

Was ist WebTransport?

QuicTransport ist ein Teil des Größeren WebTransport-Initiative. WebTransport ist eine Sammlung von APIs zum Senden und Empfangen von Daten zwischen einem Webclient und einem Server. QuicTransport ist die Schnittstelle zur Verwendung des QUIC-Protokolls im Kontext der bidirektionalen WebTransport-Kommunikation.

Chrome implementiert zuerst den QuicTransport-Teil von WebTransport, vor allen anderen vorgeschlagenen Schnittstellen. Das Chrome-Team traf die Entscheidung, QuicTransport zu starten, nachdem es mit Webentwicklern über deren Anwendungsfälle gesprochen hatte. Wir freuen uns darauf, auf der Grundlage der Erfahrungen der Entwickler mit QuicTransport frühzeitig Feedback zu den gesamten WebTransport-Anstrengungen einzuholen.

Anwendungsfälle

Dies ist eine kleine Liste der Möglichkeiten, wie Entwickler QuicTransport verwenden können.

• Senden Sie den Spielstatus in regelmäßigen Abständen mit minimaler Latenz an einen Server mit kleinen, unzuverlässigen und außer Betrieb befindlichen Nachrichten.
• Empfangen Sie von einem Server gesendete Medienströme mit minimaler Latenz, unabhängig von anderen Datenströmen.
• Empfangen Sie Benachrichtigungen, die von einem Server gesendet wurden, während eine Webseite geöffnet ist.

Im Rahmen des Herkunftsnachweisverfahrens sind wir daran interessiert, mehr darüber zu erfahren, wie Sie QuicTransport nutzen möchten.

Tatsächlicher Zustand

Verknüpfung von QuicTransport mit anderen Technologien

Ist QuicTransport ein Ersatz für WebSockets?

Vielleicht Es gibt Anwendungsfälle, in denen WebSockets o QuicTransport kann ein gültiges Kommunikationsprotokoll sein.

Die WebSockets-Kommunikation basiert auf einem einzigen, zuverlässigen und geordneten Nachrichtenfluss, der für einige Arten von Kommunikationsanforderungen geeignet ist. Wenn Sie diese Funktionen benötigen, können sie auch von den QuicTransport-Stream-APIs bereitgestellt werden. Im Vergleich dazu bieten die Datagramm-APIs von QuicTransport eine Bereitstellung mit geringer Latenz, ohne Zuverlässigkeits- oder Bestellgarantien, sodass sie kein direkter Ersatz für WebSockets sind.

Die Verwendung von QuicTransport über die Datagram-APIs oder über mehrere gleichzeitige Streams-API-Instanzen bedeutet, dass Sie sich keine Sorgen machen müssen Head-of-Line-Blockierung, was bei WebSockets hinderlich sein kann. Gleichzeitig ergeben sich Leistungsvorteile bei der Ermittlung neuer Verbindungen, da Schneller Händedruck Es ist schneller als das Starten von TCP über TLS.

QuicTransport ist Teil eines neuen Spezifikationsentwurfs, und als solches ist das WebSocket-Ökosystem rund um Client- und Serverbibliotheken derzeit viel robuster. Wenn Sie etwas benötigen, das "out of the box" mit gängigen Serverkonfigurationen und umfassender Web-Client-Unterstützung funktioniert, ist WebSockets zu diesem Zeitpunkt die bessere Option.

Ist QuicTransport dasselbe wie eine UDP-Socket-API?

QuicTransport ist kein UDP-Socket-API. Obwohl QUIC UDP "unter der Haube" verwendet, stellt QuicTransport Anforderungen in Bezug auf Verschlüsselung und Überlastungskontrolle, die es zu mehr als nur einer einfachen UDP-Socket-API machen.

Ist QuicTransport eine Alternative zu WebRTC-Datenkanälen?

Ja, für Client-Server-Verbindungen. QuicTransport hat viele der gleichen Eigenschaften wie WebRTC-Datenkanäle, obwohl die zugrunde liegenden Protokolle unterschiedlich sind.

Im Allgemeinen erfordert der Betrieb eines QUIC-kompatiblen Servers weniger Installation und Konfiguration als die Wartung eines WebRTC-Servers, was bedeutet, dass Sie verschiedene Protokolle verstehen (EIS, DTLSy SCTP) für einen funktionierenden Transport. WebRTC hat viele weitere bewegliche Teile, die zu fehlgeschlagenen Client-Server-Verhandlungen führen könnten.

Die QuicTransport-API wurde mit Blick auf die Anwendungsfälle von Webentwicklern entwickelt und sollte sich eher wie das Schreiben von modernem Webplattformcode anfühlen als die Verwendung der WebRTC-Datenkanalschnittstellen. Im Gegensatz zu WebRTC, QuicTransport wird in unterstützt Web-Mitarbeiter, mit dem Sie Client-Server-Kommunikationen durchführen können, ohne eine bestimmte HTML-Seite zu berücksichtigen. Weil QuicTransport ein Strömungen-kompatible Schnittstelle, unterstützt Optimierungen rund um Gegendruck.

Wenn Sie jedoch bereits über ein funktionierendes WebRTC-Client-/Server-Setup verfügen, mit dem Sie zufrieden sind, bietet der Wechsel zu QuicTransport möglicherweise keine großen Vorteile.

Probier es aus

Der beste Weg, um mit QuicTransport zu experimentieren, ist die Verwendung von dieser Python-Code um einen QUIC-kompatiblen Server lokal zu starten. Sie können diese Seite dann mit a . verwenden grundlegender JavaScript-Client um die Client / Server-Kommunikation zu testen.

Verwenden der API

QuicTransport wurde nach den Grundelementen der modernen Webplattform entwickelt, wie z Streams API. Es hängt stark davon ab Versprechenund es passt ganz gut dazu asynchron y erwarten.

Der Ursprungsnachweis von QuicTransport unterstützt drei verschiedene Arten von Verkehr: Datagramme sowie Einweg- und Zweiwegflüsse.

Stellen Sie eine Verbindung zu einem Server her

Sie können eine Verbindung zu einem QUIC-Server herstellen, indem Sie eine erstellen QuicTransport Beispiel. Das URL-Schema muss sein Quic-Transport. Sie müssen die Portnummer explizit angeben.

Sie sollten die verwenden bereit verspricht, auf den Verbindungsaufbau zu warten. Dieses Versprechen wird erst erfüllt, wenn die Konfiguration abgeschlossen ist und wird abgelehnt, wenn die Verbindung in der QUIC / TLS-Phase fehlschlägt.

das geschlossen Die Zusage wird erreicht, wenn die Verbindung regelmäßig geschlossen wird, und wird abgelehnt, wenn die Schließung unerwartet war.

Wenn der Server die Verbindung aufgrund von a ablehnt Kundenangabe Fehler (z. B. URL-Pfad ist ungültig) dann verursacht das geschlossen ablehnen, während bereit bleibt ungelöst.

const url address = 'quic-transport: //example.com: 4999 / foo / bar' ;
 const transport = new QuicTransport ( URL-Adresse ) ;

 transportieren . geschlossen . dann ( ( ) => {
 Konsole . log ( `Die QUIC-Verbindung zu $ {url}` wurde ordnungsgemäß geschlossen .);
 } ) . fangen ( ( Fehler ) => {
 Konsole . error ( 'Die QUIC-Verbindung zu $ {url address} wurde wegen $ {error} geschlossen.' ) ;
 } ) ;

 warten auf den Transport . bereit ;

Datagramm-API

Sobald Sie eine Instanz von QuicTransport haben, die mit einem Server verbunden ist, können Sie damit diskrete Datenbits senden und empfangen, die als bezeichnet werden Datagramme.

das sendDatagrams () Die Methode gibt a zurück WritableStream, mit dem ein Webclient Daten an den Server senden kann. das receiveDatagrams () Die Methode gibt a zurück ReadableStream, mit dem Sie Daten vom Server abhören können. Beide Streams sind von Natur aus unzuverlässig, sodass es für den Server möglich ist, die von Ihnen geschriebenen Daten nicht zu empfangen und umgekehrt.

Beide Stromarten verwenden Uint8Array Instanzen für die Datenübertragung.

const ws = transport . sendDatagrams ( ) ;
 const writer = ws . getWriter ( ) ;
 const data1 = neues Uint8Array ( [ 65 , 66 , 67 ] ) ;
 const data2 = neues Uint8Array ( [ 68 , 69 , 70 ] ) ;
 Schriftsteller . schreiben ( Daten1 ) ;
 Schriftsteller . schreiben ( data2 ) ;

 const rs = Transport . receiveDatagrams ( ) ;
 const reader = rs . getReader ( ) ;
 while ( wahr ) {
 const { value , done } = warte auf den Leser . read ( ) ;
 if ( erledigt ) {
 Pause ;
 }}
 Konsole . log ( Wert ) ;
 }}

Streams API

Sobald Sie sich mit dem Server verbunden haben, können Sie QuicTransport auch zum Senden und Empfangen von Daten mithilfe seiner API-Streams verwenden.

Jeder Teil aller Übertragungen ist a Uint8Array. Im Gegensatz zu den Datagramm-APIs sind diese Streams zuverlässig. Da jedoch jeder Stream unabhängig ist, kann die Reihenfolge der Daten zwischen den Streams nicht garantiert werden.

SendStream

EIN SendStream wird vom Webclient mit dem createSendStream () Methode eines QuicTransport Instanz, die ein Versprechen für die zurückgibt SendStream.

Verwenden Sie die schließen () Methode von WritableStreamDefaultWriter verbunden mit der Sequenz zum Senden von a QUIC Stream FIN Bit zum Server. Der Browser versucht, alle ausstehenden Daten zu senden, bevor der zugehörige QUIC-Fluss geschlossen wird.

const stream = Transport abwarten . createSendStream ( ) ;
 const writer = stream . beschreibbar . getWriter ( ) ;
 const data1 = neues Uint8Array ( [ 65 , 66 , 67 ] ) ;
 const data2 = neues Uint8Array ( [ 68 , 69 , 70 ] ) ;
 Schriftsteller . schreiben ( Daten1 ) ;
 Schriftsteller . schreiben ( data2 ) ;
 versuche {
 erwarte Schriftsteller . close ( ) ;
 Konsole . log ( 'Alle Daten wurden gesendet.' ) ;
 } catch ( Fehler ) {
 Konsole . Fehler ( ` Ein Fehler ist aufgetreten: $ { Fehler } ` ) ;
 }}

Verwenden Sie auf die gleiche Weise die abort () Methode von WritableStreamDefaultWriter senden a QUIC RESET_STREAM zum Server. Wenn Sie verwenden abort (), kann der Browser alle ausstehenden Daten verwerfen, die noch nicht gesendet wurden.

const ws = Transport abwarten . createSendStream ( ) ;
 const writer = ws . getWriter ( ) ;
 Schriftsteller . schreibe ( ... ) ;
 Schriftsteller . schreibe ( ... ) ;
 erwarte Schriftsteller . abort ( ) ;

ReceiveStream

EIN ReceiveStream es wird vom Server gestartet. Holen Sie sich ReceiveStream Es ist ein zweistufiges Verfahren für einen Webclient. Erster Aufruf receiveStreams () Methode eines QuicTransport Instanz, die a zurückgibt ReadableStream. Jedes Stück davon ReadableStreamist wiederum a ReceiveStream damit kann man lesen Uint8Array Vom Server übermittelte Instanzen.

asynchrone Funktion readFrom ( receiveStream ) {
 const reader = receiveStream . lesbar . getReader ( ) ;
 while ( wahr ) {
 const { done , value } = warte auf den Leser . read ( ) ;
 if ( erledigt ) {
 Pause ;
 }}
 Konsole . log ( Wert ) ;
 }}
 }}
 const rs = Transport . receiveStreams ( ) ;
 const reader = rs . getReader ( ) ;
 while ( wahr ) {
 const { done , value } = warte auf den Leser . read ( ) ;
 if ( erledigt ) {
 Pause ;
 }}
 warte auf readFrom ( Wert ) ;
 }}

Das Schließen eines Stroms können Sie anhand der geschlossen Versprechen von ReadableStreamDefaultReader. Wenn die QUIC-Sequenz ist geschlossen mit dem FIN-Bit, das geschlossen Das Versprechen wird nach dem Lesen aller Daten erreicht. Wenn der QUIC-Flow abrupt geschlossen wird (zum Beispiel durch STREAM_RESET) Also, die geschlossen Versprechen abgelehnt.

const reader = receiveStream . lesbar . getReader ( ) ;
 Leser . geschlossen . dann ( ( ) => {
 Konsole . log ( 'Der ReceiveStream wurde ordnungsgemäß geschlossen.' ) ;
 } ) . catch ( ( ) => {
 Konsole . Fehler ( 'Der ReceiveStream wurde abrupt geschlossen.' ) ;
 } ) ;

Bidirektionaler Strom

EIN Bidirektionaler Strom Es kann vom Server oder vom Client erstellt werden.

Web-Clients können eine erstellen, indem Sie die createBidirectionalStream () Methode eines QuicTransport Instanz, die ein Versprechen für a zurückgibt Bidirektionaler Strom.

const stream = Transport abwarten . createBidirectionalStream ( ) ;

Kannst du ein hören? Bidirektionaler Strom erstellt vom Server mit dem receiveBidirectionalStreams () Methode eines QuicTransport Instanz, die a zurückgibt ReadableStream. Jedes Stück davon ReadableStreamist wiederum a Bidirektionaler Strom.

const rs = Transport . receiveBidrectionalStreams ( ) ;
 const reader = rs . getReader ( ) ;
 while ( wahr ) {
 const { done , value } = warte auf den Leser . read ( ) ;
 if ( erledigt ) {
 Pause ;
 }}
 }}

EIN Bidirektionaler Strom es ist nur eine Kombination von a SendStream y ReceiveStream. Die Beispiele in den vorherigen beiden Abschnitten erklären, wie Sie sie verwenden.

Mehr Beispiele

das WebTransport-Spezifikationsprojekt Enthält mehrere zusätzliche Online-Beispiele sowie eine vollständige Dokumentation aller Methoden und Eigenschaften.

Unterstützung beim Ursprungsnachweis aktivieren

1. Fordern Sie einen Token an von Ihrer Herkunft.
2. Fügen Sie das Token Ihren Seiten hinzu. Es gibt zwei Möglichkeiten, dies zu tun:
   • Füge hinzu ein Ursprungsversuch Tag an die Kopfzeile jeder Seite an. Als Beispiel könnte dies so aussehen:
     
   • Wenn Sie Ihren Server konfigurieren können, können Sie das Token auch mit a . hinzufügen Origin-Trial HTTP-Header. Der resultierende Antwortheader sollte folgendermaßen aussehen:
     Origin-Trial: TOKEN_GOES_HERE

QuicTransport in Chrome DevTools

Unglücklicherweise, Chrome DevTools Die Unterstützung für QuicTransport ist nicht bereit für den Beginn des Ursprungsnachweises. Bitte "Stern" dieses Chromproblem um Benachrichtigungen über Updates in der DevTools-Oberfläche zu erhalten.

Datenschutz- und Sicherheitsaspekte

Bitte sehen Sie sich ... an jeweiliger Abschnitt des Entwurfs der Spezifikation für einen maßgeblichen Leitfaden.

Feedback

Das Chrome-Team möchte Ihre Gedanken und Erfahrungen mit dieser API während des gesamten Quelltestverfahrens hören.

Kommentare zum API-Design

Könnte etwas in der API sein, das umständlich ist oder nicht wie erwartet funktioniert? Oder fehlen noch Teile, die Sie brauchen, um Ihre Idee in die Tat umzusetzen?

Präsentieren Sie ein Hindernis im Web Transport GitHub Repositoryoder fügen Sie Ihre Gedanken zu einem bestehenden Hindernis hinzu.

Problem mit der Implementierung?

Haben Sie einen Fehler bei der Chrome-Implementierung gefunden?

Einen Fehler einreichen https://new.crbug.com. Geben Sie so viele Details wie möglich sowie einfache Anweisungen für die Reproduktion an.

Planen Sie, die API zu verwenden?

Ihr öffentlicher Support hilft Chrome bei der Priorisierung von Funktionen und zeigt anderen Browser-Anbietern, wie wichtig es ist, diese zu unterstützen.

• Stellen Sie sicher, dass Sie sich für das angemeldet haben Essay der Herkunft um Ihr Interesse zu zeigen und Ihre Domain- und Kontaktinformationen anzugeben.
• Senden Sie einen Tweet an @Cromodev mit #QuicTransport und Details darüber, wo und wie Sie es verwenden.

Allgemeine Diskussion

Du kannst den ... benutzen Web-Transport-Entwickler Google Group für allgemeine Fragen oder Probleme, die in keine der anderen Kategorien passen.

Vielen Dank

Dieser Beitrag enthält Informationen aus der WebTransport-Erklärer, Entwurf einer Spezifikationy zugehörige Konstruktionsunterlagen. Vielen Dank an die jeweiligen Autoren für die Bereitstellung dieser Grundlage.

Das Hauptbild dieses Beitrags stammt von Robin Pierre auf Unsplash.