loadDecodedBuffer in version 7

[vishal-4way]

hello all

I already checked the #2806

while using >
const url = URL.createObjectURL(new Blob([audioBuffer], { type: 'audio/wav' }))
const peaks = [ audioBuffer.getChannelData(0), audioBuffer.getChannelData(1) ]
const duration = audioBuffer.duration

wavesurfer.load(url, peaks, duration);

I am getting this error (Uncaught (in promise) DOMException: The element has no supported sources.) at
wavesurfer7.js:1

Is there any alternative way for using loadDecodedBuffer as because of using blob don't no why Iphone increase the total resources size, single audio file becomes two for the browser using blog

and you guys are planning for adding loadDecodedBuffer method in the version 7 ?

thanks!

[katspaugh]

You could try loadBlob:

const blob = new Blob([audioBuffer], { type: 'audio/wav' })
const peaks = [ audioBuffer.getChannelData(0), audioBuffer.getChannelData(1) ]
const duration = audioBuffer.duration
wavesurfer.loadBlob(blob, peaks, duration);

[vishal-4way]

Still I am getting this error (Uncaught (in promise) DOMException: The element has no supported sources.) at
wavesurfer7.js:1

[katspaugh]

Show your code.
If you read #2806, there's an edit saying you need to also set the header bytes as per https://stackoverflow.com/questions/62172398/convert-audiobuffer-to-arraybuffer-blob-for-wav-download/62173861#62173861

[vishal-4way]

thanks !
after applying this https://stackoverflow.com/questions/62172398/convert-audiobuffer-to-arraybuffer-blob-for-wav-download/62173861#62173861

we can play the songs thanks !

Is there any alternative way for using loadDecodedBuffer as because of using blob don't no why Iphone increase the total resources size, single audio file becomes two for the browser using blog

and you guys are planning for adding loadDecodedBuffer method in the version 7 ?

[katspaugh]

No plans to bring back loadDecodedBuffer as we're not using a Web Audio buffer for playback anymore.

[vishal-4way]

thanks!

[lin2019]

When loading, the waveform of a single channel can be displayed, but it quickly becomes a complete waveform again

[lin2019]

In other words, I have a dual channel audio, but I only want to display the left channel

[Guillermogsjc]

hello @katspaugh,

and what happens if you want to provide an ArrayBuffer representing the wav as it was done in v6 like this
for a componente of type WebAudio

const audioContext = new (window.AudioContext)();
const audioBuffer = await audioContext.decodeAudioData(elementArrayBuffer);
this.singleWave.loadDecodedBuffer(audioBuffer);
in this example there is no blob or explicit uri generated. Maybe you want to avoid the browser showing the audio blob or any uri with the audio

In the example use case i have an audio encrypted, and I decrypt it into an ArrayBuffer and then provide it to wavesurfer component as stated, being opaque for the console and network the decrypted audio

By dropping this loadDecodedBuffer and force the blob way, you lose this use case, not clear why.

On the use case exposed to access the decrypted audio you need to go against the memory directly, it is several points harder than exposing it thorugh a blob or a URL.

[katspaugh]

v7 is no longer Web Audio-centric, and that's the reason to not support this use case. Wavesurfer wants a URL, a blob, or a media element as its input.

The Web Audio implementation is v7 is an emulation of the HTMLMediaElement interface: https://raw.githubusercontent.com/katspaugh/wavesurfer.js/main/src/webaudio.ts. You can copy it to make your own pre-decoded buffer-based custom media element.

[Guillermogsjc]

thanks @katspaugh for the clue to implement the pre-decoded buffer