Colabtools: Record audio using javascript's getUserMedia

[korakot]

I want to record audio, then process & visualize it with python.
My plan is to use javascript to call getUserMedia({audio: true}), then pass the audio data to python using google.colab.kernel.invokeFunction.

The problem is that Chrome won't allow a plain <iframe> to access microphone, probably for security reason. You need to write explicitly like this
<iframe src="https://example.com" allow="microphone"></iframe>

Currently, the iframe code is something like

<iframe name="output-iframe-xxx" sandbox="allow-forms allow-scripts allow-popups allow-same-origin allow-pointer-lock allow-popups-to-escape-sandbox" 
src="...."></iframe>

Can you change this iframe template code to include allow="microphone; autoplay" as well?
Or is there a way to change the template myself? I can't find anything in the source about iframe.
Can I access it through get_ipython() somehow?

[korakot]

Not just microphone, some users may need other features as well. So, let's at least add:
allow="autoplay; camera; fullscreen; geolocation; microphone; midi; vr"

You can see the full list here. There is also a Feature Policy Explainer on how it works.

[blois]

Access to microphone and camera should be rolling out early next week. Currently access is only being enabled for outputs which have been executed within the current session. I'd prefer to continue on a case-by-case basis.

What is the scenario you'd like autoplay for?

[korakot]

I have audio data in a variable. When I print it, it is displayed by its html audio tag with autoplay. I can listen to it without moving my hand to the mouse and click play.

[korakot]

Thanks for the microphone support. I look forward to the autoplay.

Here's my gist that implement recording audio in Colab

https://gist.github.com/korakot/c21c3476c024ad6d56d5f48b0bca92be

[blois]

Autoplay is now live as well.

[korakot]

For camera, I have done it as well. Such a cool feature.

https://gist.github.com/korakot/d1573057a48eac8c13bdd3d3c4171c84

[blois]

Very cool!
Here's a version of it in a notebook, slightly tweaked:
https://colab.research.google.com/gist/blois/612e157030788553b267c01ca949c5dd/photo_capture.ipynb

[korakot]

Can you explain the /gist/blois/xxx URL scheme?
It's my first time seeing it here.
Is it a feature where we can collect our own personal gists within Colab?

[blois]

File -> Save a copy as a GitHub Gist...

It'll save into GitHub's Gists:
https://gist.github.com/blois/612e157030788553b267c01ca949c5dd

The unique hash there is just GitHub's identifiers.

[korakot]

Thank you for your explanation.

I am curious. When I save a notebook as a gist like: https://gist.github.com/korakot/db62e43e7a922e5aec4d0fe1ba9dc9e3

There is a text link "View in Colaboratory" back to Colab.

But your gist has a beautiful badge link instead.

How can I get one like yours?

[blois]

The badge should be arriving within a day or two- I was using a testing build when I saved the notebook :)