blog-backup/README.md
OpenClaw Bot 3a81f88bfc Add MP3 audio hosting feature with Supabase Storage integration
- Create /api/audio endpoint for upload/get/delete operations
- Add AudioPlayer component with custom controls
- Add AudioUpload component for admin interface
- Update admin page with audio upload UI and indicators
- Update main blog page to use new AudioPlayer component
- Add database migration for audio_url and audio_duration columns
- Add comprehensive documentation in docs/MP3_AUDIO_FEATURE.md
- Update README with audio feature overview
2026-02-25 17:12:26 -06:00

1.7 KiB

Daily Digest Blog

Next.js App Router blog with Supabase-backed posts, authenticated admin panel, and MP3 audio hosting.

Run locally

npm install
npm run dev

Dev server runs on http://localhost:3002.

Environment variables

Set these in .env.local:

  • NEXT_PUBLIC_SUPABASE_URL
  • NEXT_PUBLIC_SUPABASE_ANON_KEY
  • SUPABASE_SERVICE_ROLE_KEY (used by external scripts/tools if needed)
  • CRON_API_KEY

Public vs admin access

  • Public blog (/) is open to everyone.
  • Reading messages (GET /api/messages) is public.
  • Admin UI (/admin) requires a signed-in Supabase user.
  • If not signed in, /admin redirects to /login.
  • Write APIs (POST/DELETE /api/messages) require either:
    • a valid Supabase user bearer token, or
    • x-api-key: <CRON_API_KEY> (for automation/cron).

Login flow

  1. Open /login
  2. Sign in with a Supabase Auth email/password user
  3. You are redirected to /admin

Digest automation endpoint

  • POST /api/digest requires x-api-key: <CRON_API_KEY>
  • Used for cron-based digest publishing

MP3 Audio Hosting

Upload and host MP3 files for individual blog posts.

Features

  • Upload audio files up to 50MB
  • Custom audio player with play/pause, seek, and volume controls
  • Audio indicator in admin post list
  • Automatic duration estimation
  • Stored in Supabase Storage (podcast-audio bucket)

Usage

  1. Go to /admin and log in
  2. Click "Edit" on any post
  3. Scroll to "Audio Attachment" section
  4. Upload an MP3 file
  5. Save changes

API Endpoints

  • GET /api/audio?postId={id} - Get audio info for a post
  • POST /api/audio - Upload audio file (requires auth)
  • DELETE /api/audio - Remove audio from post (requires auth)

See docs/MP3_AUDIO_FEATURE.md for full documentation.