Bubble with Speech to Text using AssemblyAI - Part 1

Integrating Assembly AI with Bubble

In this Bubble tutorial video, I'm going to be demonstrating how to link in the Assembly AI API with your Bubble app. This will give you full speech to text transcription, speech to text recognition, whatever you want to call it in your Bubble app, it's for you to be able to offer to your app users. Assembly AI is a very impressive service. You might have heard of the Whisper API from OpenAI that is also a speech to text service, but in my opinion, the Assembly AI overcome some of the difficulties you may have experienced using Whisper with Bubble, such as a file size limit or the API connector timing out when you send your request to OpenAI. Assembly AI overcomes that because Assembly AI makes use of webhooks. It takes slightly longer, it costs slightly more, but there are more features and here is how you integrate it in with your Bubble app.

Setting Up the API Connector

So here is my demo app and I go and I install the API connector. If I haven't already, I go add plugins and install it here. I then add a new API and I'll call this Assembly. And I then head over to the documentation for Assembly AI. And I am looking to make a post request and my API key goes in the header as authorization. So I can say private key in header authorization. And then my request goes to this URL. So I can say process, or I'll just say transcribe audio file. I turn it into an action so that I can access it in a workflow. I then change this to get pasting in the endpoint. What else do I need? I then add data. And so data is contained here. I've copied and pasted across. This can go into my JSON object section here.

Using Assembly AI API

Similarly to the Whisper API, you basically have two ways of using it. I will be demonstrating with the Assembly AI API, how to basically point them in the direction of a publicly accessible audio file on the internet and generate a transcription from that file. You also have the option of uploading a local file that may well be a better privacy option because then you've not got any files being publicly made available on the internet. So I'll just change this here to audio file URL. And then I need my API key, which I can get from signing into my Assembly AI account, going developers and copying my key. I will be refreshing this key at the end of this tutorial and pasting the key into here.

Testing the API Call

Now I just need to find an audio file to demo this with. I've previously uploaded an audio file to my Bubble storage. And remember, this can be anywhere that is publicly accessible on the internet. So I'm going to copy and get the link address. Go back into my API connector and paste in the address here. Right, and then let's test it. So I initialized the call and I get back this response. And this is where Assembly AI is different to Whisper, which is that I get back an ID and I don't actually get back the transcription because it's processing it. I happened to have uploaded a very small audio file and so it should happen incredibly quickly, but I don't get the response back. I have to query the ID here.

Getting the Processed Transcript

So in fact, I'm gonna hit save and then I'm going to add a new call and I'm gonna call this get processed transcript. And go back to their documentation and say here, yeah, getting the transcription result. And so I have to make another call. And so this time it is a get call to this URL. And at the end, I put the transcription ID and also turn this into an action. And my transcription ID, I could run the call again, but I'm just gonna go edit manually because I know I can recall the last result here. Copy that. And then paste it into here. I'm gonna move that down 'cause I first transcribed the audio file and then I get the transcription. So now let's initialize the call. And here we go. Now I actually get the text, which is this is a test of the Assembly AI API. And so I get that back.

Conclusion and Next Steps

That's the end of part one. In the next video, I'm going to demonstrate how you can incorporate webhooks so that your Bubble app knows when a transcription from Assembly AI is ready and it will go and retrieve it automatically once it has been notified.