Auto-generate titles, descriptions & tags for Supabase uploads
Introduction
In this guide, you will:
- Upload a file to Supabase Storage.
- Get a title, description, and tags from the ittybit tasks api.
- Set up a webhook receiver function.
- Insert the results into your Supabase database.
Step 1: Create a Supabase storage bucket
You can use an existing storage bucket or create a new one.
If you haven't already created a bucket, you can do so with the following SQL script with the Supabase SQL editor:
Step 2: Upload a file to Supabase storage bucket
We will start by uploading a media file to the bucket.
Here's a sample (using Supabase Edge Functions) which uploads a file to a bucket called ittybit-storage
.
Step 3: Get a signed URL
A signed URL gives ittybit temporary access to a file in your supabase bucket.
Step 4: Send a POST request to ittybit tasks API
Prerequisite: This section uses the ittybit TypeScript SDK. Make sure it's installed in your project.
Next, use the ittybit SDK to create an intelligence task with the signed URL from Supabase Storage.
If you don’t have a webhook endpoint ready, you can use a webhook site placeholder (such as webhook.site) for the webhook_url
.
Step 5: Create a table to store the intelligence results
Run the below SQL script in your Supabase SQL editor.
This will create a table called ittybit_intelligence
in your Supabase project.
Step 6: Set up a webhook receiver function
To capture task results from ittybit and insert them into your Supabase database, you need a webhook endpoint.
This endpoint listens for POST requests from ittybit once a task completes.
Here's a sample Supabase Edge Function:
This function validates the incoming request, then writes the results into ittybit_intelligence
within your Supabase Project.
Step 7: Update the task's webhook_url
You can now set the webhook_url
property to your Supabase Edge function's public URL.
PLACEHOLDER IMAGE FOR SUPABASE EDGE FUNCTIONS PUBLIC URL
You can now test end to end by uploading a file to Supabase Storage and checking the webhook endpoint for the results.
Full example
Conclusion
When ittybit finishes processing the file, it will send the title, description, and tags to your webhook endpoint, and they will be inserted automatically into your Supabase database.
You now have a working pipeline where:
- Files are uploaded to Supabase Storage.
- Tasks are created in ittybit using signed URLs.
- Once processing is complete, ittybit delivers the results to your webhook endpoint.
- The webhook inserts the metadata directly into your Supabase database.
This gives you a fully automated flow without the need for manual polling.