I am trying to embed an audio file (.wav) in my dash app. Unfortunately the app does not display anything.
What I am currently doing is using a python server (http.server) and getting the file from it.
audio_filename = 'http://localhost:9999/file.wav'
app.layout =html.Div([html.Audio(id='audio', src=audio_filename)])
But when I use html.Img with an png file it perfectly works.
img_filename = 'http://localhost:9999/file.png'
app.layout =html.Div([html.Img(id='img', src=img_filename)])
I searched around and I didn’t find much on the html.Audio component and I don’t know how to proceed right now.
Thanks in advance for your help guys!
Looking at the audio docs (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio), it looks like you might need something like
Yes! That has done the trick! Thank you!
Does anyone know if there’s a way to remove the download button from this component? I don’t see an option to use
controlsList="nodownload" as suggested here
No there is no straight forward way to do that.
Even on dash html component page also (https://github.com/plotly/dash-html-components/blob/master/dash_html_components/Video.py) there is no mention of “controlsList” being implemented.
one work around is to use “dash_dangerously_set_inner_html”
below is my implementation of it. Hope this helps you
app.layout = html.Div([
height="350" src = '/assets/videoplayback.mp4' controls controlsList="nodownload">