I have an external server URL where I send credentials and an ID to retrieve an audio file, like
Instead of exposing the credentials to the user by calling this URL from JavaScript, I tried to fetch the data from the backend and stream it to the UI request on my server.
using (Stream mystream = httpResponse2.GetResponseStream())
{
using (BinaryReader reader = new BinaryReader(mystream))
{
int length = 2048;
byte[] buffer = new byte[length];
System.Web.HttpResponse response = System.Web.HttpContext.Current.Response;
response.BufferOutput = true;
response.ContentType = "audio/wav";
while((bytesRead = reader.Read(buffer, 0, buffer.Length)) > 0)
{
response.OutputStream.Write(buffer, 0, bytesRead);
}
response.End();
}
}
Successfully, I can now play the streamed audio in an <audio> element.
However, I am facing some issues:
- During playback, the seek control bar is always stuck at 0 as the audio length shows as Infinity. This prevents me from using the control slider to move to different parts of the audio.
- When the audio ends,
$("audio")[0].durationreturns extremely large numbers like 9188187664790.943 for a 20-30 second audio clip, and the display time also shows strange negative values. - I am unable to find a solution that allows seeking into unbuffered areas of the audio.
I'm uncertain if this is the correct or best approach, so any suggestions on alternative methods would be greatly appreciated.