Interactive Apple Music Player

Experience Apple Music with full playback controls using MusicKit on the Web

Initializing Apple Music Player...

Connect to Apple Music

To use the interactive player, you need to connect your Apple Music account.

Note: Apple Music subscription is required for full playback

🚨 Localhost Development Notes

If you're experiencing authorization issues on localhost, this is a known limitation with Apple Music API:

Common Issues:

  • ✅ Authorization appears successful (status 3)
  • ❌ No Music User Token is obtained
  • ❌ API calls fail with 401 Unauthorized

Solutions:

  1. Use a tunneling service (Recommended):
    • Install ngrok: npm install -g ngrok or download from ngrok.com
    • Start your app: dotnet run
    • In another terminal: ngrok http https://localhost:7163
    • Use the ngrok URL (e.g., https://abc123.ngrok.io) instead of localhost
  2. Test without origin claim:
    • Add ?noorigin=true to your URL
    • Example: https://localhost:7163/apple-music-player?noorigin=true
  3. Deploy to a test server:
    • Deploy to Azure, AWS, or any hosting with a proper domain
    • Ensure HTTPS is enabled

Debug Information:

  • Check console for "Token debug info" to verify JWT structure
  • Look for "Token origin claim" to see what origins are included
  • Verify your Apple Developer account has Apple Music API enabled
An unhandled error has occurred. Reload 🗙