Auf meinem Server verwende ich Audiowaveform, um JSON-Daten aus meinen Audiodateien zu generieren.
Am Frontend verwende ich Wavesurfer-JS , um die Wellenform basierend auf früheren JSON-Daten zu zeichnen.
Das Problem ist, dass der Wavesurfer-JS auf der Seite die Audiodatei die ganze Zeit über im Hintergrund herunterlädt (und nicht nur, wenn der Benutzer die Wiedergabetaste drückt).
Dies ist mein Versuch.
Dies ist der hervorstechende Teil:
%Vor% Im Grunde muss ich mich auf wavesurfer.load konzentrieren und eine neue Funktion zu diesem JavaScript hinzufügen, um nur zu zeichnen von Spitzen (JSON-Daten) die Wellenform und nicht herunterladen Audiodatei beim Laden der Seite, sondern nur, wenn der Benutzer die Play-Taste drücken.
Wie kann ich es erreichen?
Ich habe eine Weile gebraucht, um den Wavesurfer-JS-Code zu hacken, um herauszufinden, wie ich ihn zeichnen kann, ohne den Song bereits zu laden: P
Das Setzen der Peaks in der Backend-Variablen und das Aufrufen von drawBuffer haben den Trick gemacht, indem wir das mit einer Logik für die Wiedergabetasten kombiniert haben und wir erhalten den folgenden Code:
%Vor% Stellen Sie sicher, dass Sie das unnötige <audio> -Tag aus dem HTML entfernen, Browser scheinen beim Laden alle Audiodateien in diesen Tags herunterzuladen und Attribute wie preload=false scheinen ignoriert zu werden ...
Tags und Links javascript jquery json audio waveform