Docs/Content/Media hosting

Media hosting

Where and how to host your audio files and images

Your audio files and images need to be accessible via public URLs. This guide covers reliable hosting options for audio guide content.

Quick recommendations

ProviderBest ForFree TierPricing
Cloudflare R2Most projects (recommended)10GB storage, no egress fees$0.015/GB/month
Backblaze B2Budget production10GB storage$0.006/GB/month
AWS S3Enterprise scaleLimited~$0.023/GB/month
Google Cloud StorageGCP users$300 credits~$0.020/GB/month
Supabase StorageQuick prototypes1GB storage$0.021/GB/month

We recommend Cloudflare R2 for most audio guides—zero egress fees means you pay only for storage, not downloads. This makes costs predictable regardless of how popular your tour becomes.

Cloudflare R2 (recommended)

R2 is S3-compatible storage with zero egress fees. For audio guides with many visitors, this can save significant costs.

Create Account

Sign up at cloudflare.com and enable R2 in your dashboard.

Create Bucket

Create a new R2 bucket. Enable public access via a custom domain or R2.dev subdomain.

Upload Files

Use the dashboard, S3-compatible CLI tools, or rclone to upload files.

Get URLs

Files are accessible at:

https://pub-xxxxx.r2.dev/audio/01-welcome.mp3
Cloudflare R2 documentation

Supabase Storage

Supabase offers simple storage with a clean UI—great for getting started quickly.

Create Account

Sign up at supabase.com. Create a new project.

Create Storage Bucket

Go to Storage → Create new bucket. Name it audio and set it to Public.

Upload Files

Drag and drop your audio files into the bucket.

Get URLs

Click a file → Copy URL. It will look like:

https://xxxxx.supabase.co/storage/v1/object/public/audio/01-welcome.mp3
Supabase Storage documentation

AWS S3 + CloudFront

For production tours with significant traffic, AWS S3 with CloudFront CDN is the enterprise standard.

Create S3 Bucket

In AWS Console → S3 → Create bucket. Use a region close to your visitors.

Configure Permissions

Enable public access or use CloudFront with signed URLs for access control.

Set Up CloudFront

Create a CloudFront distribution pointing to your S3 bucket. This caches files globally.

Upload Files

Use the AWS CLI or S3 console to upload your audio files.

Example URL structure

https://d1234567890.cloudfront.net/tours/london/audio/01-welcome.mp3
AWS S3 documentation

Backblaze B2

Backblaze B2 is significantly cheaper than S3 with similar reliability. Pair it with Cloudflare for free CDN via their bandwidth alliance.

Create Account

Sign up at backblaze.com.

Create Bucket

Create a new bucket and set it to Public.

Upload Files

Upload your audio and image files via the dashboard.

Get URLs

Copy the "Friendly URL" for each file:

https://f005.backblazeb2.com/file/your-bucket/audio/01-welcome.mp3
Backblaze B2 documentation

Google Cloud Storage

Similar to AWS S3, with slightly different pricing and a nicer console UI.

https://storage.googleapis.com/your-bucket/audio/01-welcome.mp3

Google Cloud offers $300 free credits for new accounts—enough to test extensively.

Google Cloud Storage documentation

File organization

Keep your files organized with a consistent structure:

tours/
├── london/
│   ├── audio/
│   │   ├── en/
│   │   │   ├── 01-big-ben.mp3
│   │   │   ├── 02-abbey.mp3
│   │   │   └── 03-eye.mp3
│   │   └── es/
│   │       ├── 01-big-ben.mp3
│   │       └── ...
│   └── images/
│       ├── cover.jpg
│       └── ...
└── barcelona/
    └── ...

Naming conventions:

  • Lowercase with hyphens
  • Number prefix for ordering (01-, 02-)
  • Language subfolder for audio
  • Descriptive names (not audio1.mp3)

CORS configuration

If you're hosting on S3 or similar, you may need to configure CORS (Cross-Origin Resource Sharing) to allow AudioGuideKit to access your files.

Example S3 CORS policy

[
  {
    "AllowedHeaders": ["*"],
    "AllowedMethods": ["GET", "HEAD"],
    "AllowedOrigins": ["*"],
    "ExposeHeaders": []
  }
]

Replace "*" in AllowedOrigins with your actual domain in production for better security: ["https://yourtour.com", "http://localhost:3000"]

Testing your URLs

Before adding URLs to your tour JSON, verify each one works:

  1. Open the URL directly in your browser
  2. Audio should play; images should display
  3. Check for HTTPS (not HTTP)
  4. Test on mobile (some hosts block certain user agents)