TikTok OAuth Minimal Implementation

A minimal TikTok OAuth implementation built on Val Town using Hono.

Features

  • ✅ Complete OAuth 2.0 flow for TikTok
  • ✅ Clean, responsive UI with TikTok-inspired styling
  • ✅ Error handling for common OAuth scenarios
  • ✅ User profile information display
  • ✅ Environment variable configuration
  • ✅ Production-ready redirect handling

Setup Instructions

1. Create TikTok Developer App

  1. Go to TikTok Developers
  2. Create a new app
  3. Note down your Client ID and Client Secret

2. Configure Environment Variables

In your Val Town project settings, add these environment variables:

  • TIKTOK_CLIENT_ID - Your TikTok app's Client ID
  • TIKTOK_CLIENT_SECRET - Your TikTok app's Client Secret

3. Configure Redirect URI

In your TikTok app settings, set the redirect URI to:

https://dcm31--[your-val-id].web.val.run/callback

The exact URL will be displayed when you first visit the app.

Endpoints

  • / - Home page with login button
  • /auth - Initiates OAuth flow (redirects to TikTok)
  • /callback - Handles OAuth callback from TikTok

OAuth Flow

  1. User clicks "Login with TikTok" on the home page
  2. User is redirected to TikTok's authorization page
  3. User grants permissions to the app
  4. TikTok redirects back to /callback with authorization code
  5. App exchanges code for access token
  6. App retrieves user profile information
  7. Success page displays user info and token data

Scopes Requested

  • user.info.basic - Basic user information
  • user.info.profile - User profile information (display name, avatar)

Security Notes

  • Uses secure HTTPS redirects
  • State parameter included for CSRF protection (currently static for demo)
  • Sensitive credentials stored as environment variables
  • Error handling prevents information leakage

Customization

The app is designed to be minimal but can be extended with:

  • Database storage for user sessions
  • Additional TikTok API scopes
  • Proper state management with random tokens
  • Session handling and logout functionality

Live Demo

Visit the deployed app at: https://dcm31--00d3ac66955511f0afa60224a6c84d84.web.val.run