aboutsummaryrefslogtreecommitdiff
path: root/files/de/web/api/readablestream/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/de/web/api/readablestream/index.html')
-rw-r--r--files/de/web/api/readablestream/index.html101
1 files changed, 101 insertions, 0 deletions
diff --git a/files/de/web/api/readablestream/index.html b/files/de/web/api/readablestream/index.html
new file mode 100644
index 0000000000..43873c162b
--- /dev/null
+++ b/files/de/web/api/readablestream/index.html
@@ -0,0 +1,101 @@
+---
+title: ReadableStream
+slug: Web/API/ReadableStream
+tags:
+ - API
+ - Fetch
+ - Interface
+ - Reference
+ - Streams
+translation_of: Web/API/ReadableStream
+---
+<p>{{APIRef("Streams")}}{{SeeCompatTable}}</p>
+
+<p><span class="seoSummary">Das <code>ReadableStream</code> Interface der <a href="/en-US/docs/Web/API/Streams_API">Streams API</a> repräsentiert einen lesbaren Datenstrom von Bytes.</span></p>
+
+<h2 id="Konstruktor">Konstruktor</h2>
+
+<dl>
+ <dt>{{domxref("ReadableStream.ReadableStream", "ReadableStream()")}}</dt>
+ <dd>Erstellt eine Instanz des <code>ReadableStream</code> Interfaces.</dd>
+</dl>
+
+<h2 id="Eigenschaften">Eigenschaften</h2>
+
+<dl>
+ <dt>{{domxref("ReadableStream.locked")}} {{readonlyInline}}</dt>
+ <dd>Gibt zurück, ob der Stream bereits für einen Reader gesperrt ist.</dd>
+</dl>
+
+<h2 id="Methoden">Methoden</h2>
+
+<dl>
+ <dt>{{domxref("ReadableStream.cancel()")}}</dt>
+ <dd>Bricht den Stream ab und signalisiert dadurch, dass der Konsument sein Interesse am Stream verloren hat. Das angegebene <code>reason</code> Argument wird an die darunterliegende Quelle weitergegeben, welche dieses benutzen kann. </dd>
+ <dt>{{domxref("ReadableStream.getReader()")}}</dt>
+ <dd>Erstellt einen Reader, dessen Typ durch die <code>mode</code> Option angegeben wird, und sperrt den Stream für den neuen Reader. Während der Stream gesperrt ist kann kein anderer Reader angelegt werden bis dieser freigegeben wurde.</dd>
+ <dt>{{domxref("ReadableStream.getIterator()")}}</dt>
+ <dd>Erstellt einen asyncronen ReadableStream-Iterator und sperrt den Stream für ihn, sodass der Iterator der einzige Leser ist. Während der Stream gesperrt ist kann kein anderer Reader angelegt werden bis dieser freigegeben wurde.</dd>
+ <dt>{{domxref("ReadableStream.pipeThrough()")}}</dt>
+ <dd>Bietet die Möglichkeit den Stream mit transformierenden Streams zu verketten.</dd>
+ <dt>{{domxref("ReadableStream.pipeTo()")}}</dt>
+ <dd>Pipet den aktuellen <code>ReadableStream</code> zu einem gegebenen {{domxref("WritableStream")}} und gibt ein {{domxref("Promise")}} zurück welches erfüllt ist, wenn der Piping-Prozess erfolgreich beendet wurde oder verwirft es, wenn irgendein anderer Fehler auftritt.</dd>
+ <dt>{{domxref("ReadableStream.tee()")}}</dt>
+ <dd>Verzweigt den <code>ReadableStream</code> in zwei neue Stream-Instanzen, auf denen parallel gelesen werden kann.</dd>
+ <dt>{{domxref("ReadableStream[@@asyncIterator]()")}}</dt>
+ <dd>Alias der <code>getIterator</code>-Methode.</dd>
+</dl>
+
+<h2 id="Benutzung">Benutzung</h2>
+
+<p>Im folgenden Beispiel wird eine {{domxref("Response")}} erzeugt, die HTML-Fragmente einer anderen Ressource fetched und an den Browser streamt.</p>
+
+<p>Dadurch wird die Benutzung von {{domxref("ReadableStream")}} in Kombination mit {{domxref("Uint8Array")}} gezeigt.</p>
+
+<pre class="brush: js notranslate">fetch("https://www.example.org/").then((response) =&gt; {
+ const reader = response.body.getReader();
+ const stream = new ReadableStream({
+ start(controller) {
+ // Die folgende Funktion behandelt jeden Daten-Chunk
+ function push() {
+ // "done" ist ein Boolean und "value" ein "Uint8Array"
+ return reader.read().then(({ done, value }) =&gt; {
+ // Gibt es weitere Daten zu laden?
+ if (done) {
+ // Teile dem Browser mit, dass wir fertig mit dem Senden von Daten sind
+ controller.close();
+ return;
+ }
+
+ // Bekomme die Daten und sende diese an den Browser durch den Controller weiter
+ controller.enqueue(value);
+ }).then(push);
+ };
+
+ push();
+ }
+ });
+
+ return new Response(stream, { headers: { "Content-Type": "text/html" } });
+});</pre>
+
+<h2 id="Spezifikationen">Spezifikationen</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <th scope="col">Spezifikation</th>
+ <th scope="col">Status</th>
+ <th scope="col">Kommentar</th>
+ </tr>
+ <tr>
+ <td>{{SpecName('Streams','#rs-class','ReadableStream')}}</td>
+ <td>{{Spec2('Streams')}}</td>
+ <td>Initial definition</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Browserkompatibilität">Browserkompatibilität</h2>
+
+<div>{{Compat("api.ReadableStream")}}</div>