Microphone access from Dashboard

Dashboard
1

I am creating a chatbot and I want to be able to talk to the chatbot through the dashboard.

I have tried the microphone node with the utils package and then using STT my bot understand the message perfectly but I need to start the recording from the node red canvas... I want to be able to click a button on my dashboard to talk to the bot.

Is this possible?
Thanks

2

Hi Sandra,

You didn't say which microphone node you are using, so I went looking for what is available in the flows library... it looks like the node-red-contrib-browser-utils provides a dashboard widget the start/stop button built-in:

Microphone

The browser starts recording after the button next to the node is clicked and stops it when the button is clicked again. The node outputs it as a WAV buffer.

1 Like
3

Hi!

I am using the node-red-contrib-browser-utils package for the microphone.

The problem is I need to start recording from the node red editor. I want to do it from the dashboard.
This flow works, but I want to add a button on my dashboard to start and stop the recording.

08
Screen Shot 2018-10-07 at 21.27.08.png1592Ă—388 45.6 KB

4

If you look at node-red-contrib-mic you will see you can send an action to it to start/stop recording. So you could have a button on the dashboard connected to a chage node that would set the action which is connected to the node.

1 Like
5

That works in my local node red. I did have to install sox in my Mac otherwise it kept crashing.

How do I make it run on the cloud?
I am using IBM Cloud Node-red boilerplate and when I click on start my app crashes :frowning:

6

Let's clarify where these various nodes capture their audio.

node-red-contrib-mic can be used to access the microphone on the device running Node-RED - the audio capture happens in the runtime. That isn't going to work when running in the cloud.

node-red-contrib-browser-utils provides a node that lets you capture audio from the microphone on the device running the browser you have opened the node-red editor in.

Neither of these nodes can be used to capture audio from a node-red-dashboard ui. To do that, you'd need to use a ui_template node to insert some custom javascript that can be used to do the audio capture when triggered. I'm sure someone must have done that - but I can't find an example at the moment.

Capturing audio in the browser is a bit fiddly, but very doable. You could use the browser-utils node as a guide for what you'd need to do - https://github.com/ibm-early-programs/node-red-contrib-browser-utils/blob/master/microphone/microphone.html

7

Bump on this topic. I am at a hackathon this weekend and the team wants to build a Node-RED Dashboard which records audio in the browser using the microphone. They don't have the programming skills to implement what Nick outlined. Would be helpful to have this capability.

1 Like
8

To start reading https://developer.mozilla.org/en-US/docs/Web/API/MediaStream_Recording_API and https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder
And if that sounds as too much to understand to cancel the idea as you simply won’t manage to get through it in the time of a hackathon.

1 Like
9

Nick did some great work on node-red-node-ui-microphone so you can now have a Node-RED Dashboard that records speech. It's straightforward to wire the new microphone node to the Watson Speech to Text node.

10

I have been trying to get node-red-node-ui-microphone for sometime now today, but have not been able to get it to work. As in Microphone node is not being recognized by the dashboard and default dashboard page shows up on /ui if deployed with just the microphone node on editor.

Is there an example in how to use this?

11

Are you using the latest version of node-red-dashboard (2.20.0 I think)? If not then try updating to that. Otherwise stop and restart node red in a terminal and copy/paste the log here (after deploying the node). Depending on your installation the easiest way to do that is to run
node-red-stop
node-red-start

2 Likes
12

Thank you Colin it seems like indeed version was the issue. It works on bumping up the Node Red dashboard version to 2.20.0.

13

im using

node-red-dashboard 2.26.0

and its not showing up in my dashboard
@Colin

14

Welcome to the forum.!

  1. What version of Node-red and node.js are you using? (see the node-RED startup log)
  2. What platform are you running on? (Rpi, Mac, PC)
  3. What browser are you using?
  4. Did you try flushing your cache?

Can you provide a copy of your flow?

15

If you are accessing the dashboard from any machine other than the one running it than the ui mic will only work if you enable https for the dashboard.
If on an iphone you will also have to go into the further safari settings in the settings app and enable the media-recorder in the experimental section.
Just two things to check depending on your set up.

Johannes

16

i am using the ibm cloude option it works on node red on the computer but not in the cloude server

17

so are you saying that the dashboard does not showup when running node-red on the IBM cloud server? Or are you saying you can't get the microphone to work when running on the IBM cloud server?

18

the microphone button does not show up on the dashboard when I use IBM cloud

19

Which microphone node are you trying to use?

20

node-red-node-ui-microphone