feat: switch Spotify auth to official Client Credentials Flow
Replaces the broken open.spotify.com/get_access_token scrape with accounts.spotify.com/api/token (Basic auth, client_credentials grant). Adds SPOTIFY_CLIENT_ID/SECRET to config, docker-compose, and .env.example. Health endpoint now reports spotify.configured; frontend disables the importer and shows a setup guide when credentials are missing. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
1 parent
7c1c444bf2
commit
468827571a
5 files changed
+77
-13
No files matched your search
+38
-1
@@ -6,13 +6,32 @@ import { makeGlobalTrackItem } from './components.js';
|
||||
import { openDlModal } from './ui.js';
|
||||
|
||||
// ─── SPOTIFY IMPORTER PAGE ───
|
||||
export function loadSpotifyImporter() {
|
||||
export async function loadSpotifyImporter() {
|
||||
if (!document.getElementById('spotify-link-input')?.value) {
|
||||
const hint = document.getElementById('spotify-importer-hint');
|
||||
const preview = document.getElementById('spotify-preview');
|
||||
if (hint) hint.style.display = '';
|
||||
if (preview) preview.style.display = 'none';
|
||||
}
|
||||
|
||||
if (S.cfg.backendUrl) {
|
||||
try {
|
||||
const h = await fetch(`${S.cfg.backendUrl}/api/health`).then(r => r.json());
|
||||
if (!h.spotify?.configured) {
|
||||
const input = document.getElementById('spotify-link-input');
|
||||
if (input) {
|
||||
input.disabled = true;
|
||||
input.placeholder = 'Spotify-Importer nicht konfiguriert (Server-Setup erforderlich)';
|
||||
}
|
||||
const hint = document.getElementById('spotify-importer-hint');
|
||||
if (hint) hint.innerHTML += `
|
||||
<div style="margin-top:16px;padding:12px;background:var(--surface);border-radius:10px;border-left:3px solid #1DB954;font-size:13px;color:var(--text2)">
|
||||
⚠ Server-Admin muss <code>SPOTIFY_CLIENT_ID</code> und <code>SPOTIFY_CLIENT_SECRET</code> setzen.
|
||||
Kostenlos unter <a href="https://developer.spotify.com/dashboard" target="_blank" style="color:#1DB954">developer.spotify.com/dashboard</a>.
|
||||
</div>`;
|
||||
}
|
||||
} catch { /* health check failed — leave UI as-is */ }
|
||||
}
|
||||
}
|
||||
|
||||
export function clearSpotifyPreview() {
|
||||
@@ -54,6 +73,24 @@ export async function resolveSpotifyLink() {
|
||||
if (data.skippedLocal > 0) toast(`${data.skippedLocal} lokale Datei(en) übersprungen (kein Stream verfügbar)`);
|
||||
_renderSpotifyPreview(data);
|
||||
} catch(e) {
|
||||
if (e.message.includes('SPOTIFY_CLIENT_ID') ||
|
||||
e.message.includes('Credentials fehlen') ||
|
||||
e.message.includes('Spotify-Token-Fehler')) {
|
||||
inner.innerHTML = `<div style="color:var(--text);padding:16px;background:var(--surface);border-radius:10px;border-left:3px solid #1DB954">
|
||||
<div style="font-weight:600;margin-bottom:8px">Spotify-Importer nicht konfiguriert</div>
|
||||
<div style="font-size:13px;line-height:1.5">
|
||||
Der Server-Admin muss einmalig Spotify-Credentials hinterlegen.<br><br>
|
||||
Schritte:<br>
|
||||
1. <a href="https://developer.spotify.com/dashboard" target="_blank" style="color:#1DB954">developer.spotify.com/dashboard</a> öffnen<br>
|
||||
2. "Create app" — Name beliebig, Redirect URI: <code>http://localhost</code><br>
|
||||
3. Client ID + Secret als Environment-Variablen setzen:<br>
|
||||
<code>SPOTIFY_CLIENT_ID=...</code><br>
|
||||
<code>SPOTIFY_CLIENT_SECRET=...</code><br>
|
||||
4. Backend neu starten
|
||||
</div>
|
||||
</div>`;
|
||||
return;
|
||||
}
|
||||
inner.innerHTML = `<div style="color:var(--danger);padding:16px;background:var(--surface);border-radius:10px">${esc(e.message)}</div>`;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in new issue
Block a user