Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Using the audio in Streamlit #1

Open
Paethon opened this issue May 18, 2022 · 11 comments
Open

Using the audio in Streamlit #1

Paethon opened this issue May 18, 2022 · 11 comments

Comments

@Paethon
Copy link

Paethon commented May 18, 2022

Maybe I am just missing something, but how do you actually use the recorded audio in your Streamlit app?

@stefanrmmr
Copy link
Owner

stefanrmmr commented May 18, 2022

@Paethon Hi Sebastian, the current version of the audio recorder enables you to record audio and download it (WAV, 16bit, 44kHz). I am working on providing an extended version of this streamlit-component soon, which can directly send the audio data back to Python via the return value interface.

Unfortunately, I ran into problems regarding the conversion of the recorded Audio-Blob (web-media) to a binary buffer (base64) that can be returned. (the conversion takes forever and converting in chunks is hardly possible/rather complicated) If you are knowledgeable in these fields of audio data processing, feel free to reach out to me!

@stefanrmmr
Copy link
Owner

@Paethon Work Around (rather not elegant but functional): You can use the current version of the component, record audio, download it and then drag the file from the browser's download preview (downloads bar bottom of the screen, left) into a streamlit file-upload component.

@stefanrmmr stefanrmmr pinned this issue May 18, 2022
@stefanrmmr stefanrmmr unpinned this issue May 18, 2022
@stefanrmmr stefanrmmr pinned this issue May 18, 2022
@Paethon
Copy link
Author

Paethon commented May 18, 2022

Thanks! Good to know I am not just too stupid to use the component 😂

And no, I, unfortunately, don't know a lot about audio processing. Good luck with the remaining problems. Once we can directly get back the audio from the component, I think this will be a very valuable addition to Streamlit!

@stefanrmmr
Copy link
Owner

@Paethon No worries 😄, I will try hard to make this happen. Stay tuned!

@jingzhaoou
Copy link

I filed the same request and found out someone else already requested the same feature. Agree that "Once we can directly get back the audio from the component, I think this will be a very valuable addition to Streamlit!"

@stefanrmmr stefanrmmr reopened this Jun 30, 2022
@millawell
Copy link

I've created a pull request for this #1

@stefanrmmr
Copy link
Owner

@Paethon @jingzhaoou Hello there folks, I've just merged @millawell's pull request and added some additional changes. Now the component directly returns audio data to the Python backend! This intermediary solution should be sufficient for shorter audio recordings (max 15sec). For longer audio cases, the merged code displays similar issues like my initial approach, as described above (exp. increasing time complexity due to conversion to arrayBuffer)

@Paethon
Copy link
Author

Paethon commented Aug 17, 2022

That's great news. Going to try it out ASAP! 😁

@tatiana-iazykova
Copy link

Hi!
I was wondering whether it's possible to disable rendering the "play" component on the webpage and only use the component for recording audio without playing it?

@3dw1np
Copy link

3dw1np commented Sep 23, 2022

Yes I would to have the same option to display or not the audioplayer.

@inarighas
Copy link

inarighas commented Oct 24, 2022

@Paethon Hi Sebastian, the current version of the audio recorder enables you to record audio and download it (WAV, 16bit, 44kHz). I am working on providing an extended version of this streamlit-component soon, which can directly send the audio data back to Python via the return value interface.

Unfortunately, I ran into problems regarding the conversion of the recorded Audio-Blob (web-media) to a binary buffer (base64) that can be returned. (the conversion takes forever and converting in chunks is hardly possible/rather complicated) If you are knowledgeable in these fields of audio data processing, feel free to reach out to me!

In the current version, the sampling rate is 48 kHz and not 44kHz. I do not know if this depends on local configuration of the browser and the microphone and if we can "programmatcally" get the sampling rate value. I think it would be handy to have the values of quantization and sampling rate along with what we get from stream.read(). This will ease further post processing we may like to perform inside the streamlit app.

PS. I am sorry if I did not respect some of the community guidelines. I can create another issue or delete this comment if not appropriate.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

7 participants