Using Cloud Storage for Firebase for hosting rich media in your Actions
The Actions on Google platform allows developers to provide rich media content in responses, such as images and audio files. This can be content that you create yourself or find on the web (for example, by using audio from the Actions on Google sound library).
When you want to host your own audio or your own images, you can use Cloud Storage for Firebase as a way to quickly store files and make them widely available to users with low latency and generous bandwidth.
If you’re already using Cloud Functions for Firebase with your Actions, it’s easy to access files that you’ve uploaded to the Firebase console.
In our code snippets below, we are using Node.js 8, Firebase Functions 2.0.0 or higher, and Firebase Tools CLI 4.0.0 or higher:
If you’re not using Cloud Functions for Firebase to host your fulfillment, you can still use Cloud Storage for Firebase in your responses.
Setting up permissions
Before starting, go to the Google Cloud Console and navigation to the IAM > IAM page. Find the Member with the name App Engine default service account. Click on the edit icon (🖉).
Add another role and select Service Accounts > Service Account Token Creator. This will allow your cloud functions to create signed URLs that can be used to serve content for your Action.
Hosting audio files
In order to return a media response in your webhook, you can obtain the download URL for both the audio file and the icon file and use the Actions on Google Node.js client library to complete the response.
In our example, we have folders for audio files and icons:
The files will be placed in a Google Cloud storage bucket. You are then able to access the file by creating a signed URL, which will allow your Action to access the file. It is recommended to save this generated URL in a database after it is created for the first time.
Then we are able to access the file URLs and send them in our MediaObject response through the Dialogflow app that we created, which will provide an Express interface to interact with the cloud function:
If you are using SSML, you can get the download URL for the audio file and return it as part of your SSML response:
Hosting image files
You can also provide a rich visual flair to your Action with cards that include an image and a description.
These images can be stored in Firebase and then shown to the user when the response includes a basic card, a list, a carousel, or a table. You can try out the Conversation Components sample to see all of these response types in action.
Then we are able to access the file URLs and send them in our BasicCard response:
Another way to host media is through Firebase Hosting, which provides a publicly accessible URL for each file you upload. You should look at the quota and pricing structure to see if that will fit your needs.
You can learn more about building conversational experiences at actions.google.com.
Want more? Head over to the Actions on Google community to discuss Actions with other developers. Join the Actions on Google developer community program and you could earn a $200 monthly Google Cloud credit and an Assistant t-shirt when you publish your first app.