Reputation: 131
Symptom
Audio streaming plays on all browsers except on Safari on iOS.
I suspect that the issues comes from MediaSource
that isn't supported on iOS, so I tried an implementation using ManagedMediaSource
, without much luck though.
Any idea of what's wrong?
Code and tests
let ms;
if ('ManagedMediaSource' in window) { // DOES NOT PLAY ON WEBKIT
let MediaSource = window.ManagedMediaSource;
ms = new MediaSource();
ms.addEventListener('sourceopen', () => {
let sourceBuffer = ms.addSourceBuffer('audio/mpeg');
// Read and play the audio data chunk by chunk
let reader = response.body.getReader();
let readChunk = async () => {
let {
value,
done
} = await reader.read();
if (done) {
ms.endOfStream();
} else {
sourceBuffer.appendBuffer(value);
await new Promise(resolve => sourceBuffer.addEventListener('updateend', resolve, {
once: true
}));
readChunk();
}
};
readChunk();
});
audio.srcObject.disableRemotePlayback = true;
audio.srcObject.srcObject = ms;
} else { // PLAYS ON ALL BROWSERS EXCEPT Safari on iOS
ms = new MediaSource();
ms.addEventListener('sourceopen', () => {
let sourceBuffer = ms.addSourceBuffer('audio/mp4');
// Read and play the audio data chunk by chunk
let reader = response.body.getReader();
let readChunk = async () => {
let {
value,
done
} = await reader.read();
if (done) {
ms.endOfStream();
} else {
sourceBuffer.appendBuffer(value);
await new Promise(resolve => sourceBuffer.addEventListener('updateend', resolve, {
once: true
}));
readChunk();
}
};
readChunk();
});
audio.src = URL.createObjectURL(ms);
audio.srcObject = null;
}
audio.play()
Upvotes: 5
Views: 427