Baseline Widely available
Hinweis: Diese Funktion ist in Web Workers verfügbar.
Die arrayBuffer()
Methode des Response
-Interfaces nimmt einen Response
Stream und liest ihn vollständig aus. Sie gibt ein Versprechen zurück, das mit einem ArrayBuffer
aufgelöst wird.
Keine.
RückgabewertEin Versprechen, das mit einem ArrayBuffer
aufgelöst wird.
DOMException
AbortError
Die Anfrage wurde abgebrochen.
TypeError
Wird aus einem der folgenden Gründe ausgelöst:
Content-Encoding
-Header nicht korrekt ist).RangeError
Es gab ein Problem beim Erstellen des zugehörigen ArrayBuffer
. Zum Beispiel, wenn die DatengröÃe mehr als Number.MAX_SAFE_INTEGER
beträgt.
In unserem fetch array buffer live haben wir einen Abspiel-Button. Wenn dieser gedrückt wird, wird die getData()
Funktion ausgeführt. Beachten Sie, dass, bevor die vollständige Audiodatei abgespielt wird, sie heruntergeladen wird. Wenn Sie ogg während des Herunterladens abspielen müssen (es streamen) - erwägen Sie die Verwendung von HTMLAudioElement
:
new Audio("music.ogg").play();
In getData()
erstellen wir eine neue Anfrage mithilfe des Request()
Konstruktors und nutzen diese, um eine OGG-Musikspur abzurufen. Wir verwenden auch AudioContext.createBufferSource
, um eine Audio-Buffer-Quelle zu erstellen. Wenn das Abrufen erfolgreich ist, lesen wir einen ArrayBuffer
aus der Antwort mithilfe von arrayBuffer()
, dekodieren die Audiodaten mit AudioContext.decodeAudioData()
, setzen die dekodierten Daten als Puffer der Audioquelle (source.buffer
), und verbinden die Quelle mit der AudioContext.destination
.
Sobald getData()
fertig ist, beginnen wir, die Audioquelle mit start(0)
abzuspielen, und deaktivieren den Abspiel-Button, damit er nicht erneut geklickt werden kann, während bereits abgespielt wird (das würde einen Fehler verursachen).
function getData() {
const audioCtx = new AudioContext();
return fetch("viper.ogg")
.then((response) => {
if (!response.ok) {
throw new Error(`HTTP error, status = ${response.status}`);
}
return response.arrayBuffer();
})
.then((buffer) => audioCtx.decodeAudioData(buffer))
.then((decodedData) => {
const source = new AudioBufferSourceNode(audioCtx);
source.buffer = decodedData;
source.connect(audioCtx.destination);
return source;
});
}
// wire up buttons to stop and play audio
play.onclick = () => {
getData().then((source) => {
source.start(0);
play.setAttribute("disabled", "disabled");
});
};
Dateien lesen
Der Response()
Konstruktor akzeptiert File
s und Blob
s, daher kann er verwendet werden, um eine File
in andere Formate zu lesen.
function readFile(file) {
return new Response(file).arrayBuffer();
}
document
.querySelector("input[type=file]")
.addEventListener("change", (event) => {
const file = event.target.files[0];
const buffer = readFile(file);
});
Spezifikationen Browser-Kompatibilität Siehe auch
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4