Client Credentials Flow — לבקשות בצד השרת ללא מעורבות משתמש (נתוני אמן ואלבום):

async function getSpotifyToken(): Promise<string> { const credentials = Buffer.from(`${CLIENT_ID}:${CLIENT_SECRET}`).toString('base64'); const resp = await fetch('https://accounts.spotify.com/api/token', { method: 'POST', headers: { 'Authorization': `Basic ${credentials}`, 'Content-Type': 'application/x-www-form-urlencoded' }, body: 'grant_type=client_credentials', }); const data = await resp.json(); return data.access_token; // живёт 3600 секунд } 

Authorization Code Flow — לנתוני משתמש (רצועה נוכחית, פלייליסטים).

נתוני אמן

async function getArtistData(artistId: string): Promise<ArtistData> { const token = await getSpotifyToken(); const [artist, topTracks, albums] = await Promise.all([ fetch(`https://api.spotify.com/v1/artists/${artistId}`, { headers: { Authorization: `Bearer ${token}` }, }).then(r => r.json()), fetch(`https://api.spotify.com/v1/artists/${artistId}/top-tracks?market=RU`, { headers: { Authorization: `Bearer ${token}` }, }).then(r => r.json()), fetch(`https://api.spotify.com/v1/artists/${artistId}/albums?include_groups=album,single&market=RU&limit=10`, { headers: { Authorization: `Bearer ${token}` }, }).then(r => r.json()), ]); return { name: artist.name, followers: artist.followers.total, genres: artist.genres, popularity: artist.popularity, image: artist.images[0]?.url, topTracks: topTracks.tracks.slice(0, 5).map((t: any) => ({ name: t.name, preview: t.preview_url, // 30-секундный превью MP3 duration: t.duration_ms, })), latestAlbum: albums.items[0], }; } 

למה הטוקן פג תוקף ומה לעשות?

הטוקן של Client Credentials חי 3600 שניות. אם לא מרעננים אותו בזמן, הבקשות יפסיקו לעבוד. אנו פותרים זאת על ידי שמירת הטוקן במטמון ורענון אוטומטי 5 דקות לפני הפגות. עבור Authorization Code Flow, אנו משתמשים ב-refresh token — הוא מאפשר קבלת טוקן גישה חדש ללא מעורבות משתמש. זה מבטל השבתות ושגיאות 401.

הטמעת נגן

<!-- Spotify Embed — не требует API --> <iframe src="https://open.spotify.com/embed/track/TRACK_ID?utm_source=generator&theme=0" width="100%" height="152" frameBorder="0" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy" title="Spotify embed"> </iframe> 

וידג'ט Now Playing

// Требует Authorization Code Flow + scope: user-read-currently-playing async function getNowPlaying(userAccessToken: string) { const resp = await fetch('https://api.spotify.com/v1/me/player/currently-playing', { headers: { Authorization: `Bearer ${userAccessToken}` }, }); if (resp.status === 204) return null; // ничего не играет return resp.json(); } 

תהליך

מה כלול

• תיעוד אינטגרציה מלא
• קוד מקור עם הערות
• הגדרת שמירת טוקן במטמון בצד השרת (מפחית בקשות API פי 3)
• הדרכה לצוות שלך (שעה אחת)
• תמיכה למשך שבועיים לאחר ההשקה

טעויות טיפוסיות

• ניהול לא תקין של refresh token: אם הטוקן לא מרענן בזמן, בקשות המשתמש מפסיקות לעבוד.
• חוסר טיפול בשגיאות API (מגבלות קצב, פסקי זמן).
• שימוש בנגן iframe ללא בדיקת תמיכת דפדפן.
• אחזור נתונים ללא שמירה במטמון — מגביר את עומס השרת.

לוחות זמנים ועלות

האינטגרציה אורכת 2 עד 5 ימי עסקים בהתאם למורכבות. העלות נעה בין $800 ל-$1500 בהתאם למורכבות. צרו קשר להערכה מדויקת.

הזמינו שילוב Spotify API היום — קבלו פעולה יציבה ותמיכה ממומחים.

צעדים מהירים לאינטגרציה:

1. רשמו את האפליקציה שלכם ב-Spotify Developer Dashboard.
2. בחרו את זרימת האימות (Client Credentials או Authorization Code).
3. יישמו שמירת טוקן במטמון כדי למנוע אימות חוזר תכוף.
4. אחזרו נתונים עם בקשות מקבילות לביצועים מיטביים.
5. פרסו ונטרו את האינטגרציה.