I am utilizing the Spotify Net Playback SDK to combine playback performance in my app. The setup works completely on Android units and Home windows Chrome, however I am encountering points on Mac Chrome and all iOS units.
The SDK appears to fail in initializing or connecting the participant on these units. I’ve carried out numerous error listeners (e.g., for initialization, authentication, and account errors), however none of them present any clues as to why this concern is going on.
Right here’s a simplified model of my hook setup for the SDK:
const useSpotifyWebPlaybackSdk = (session: ExtendedSession | null) => {
const [isReady, setIsReady] = useState(false);
const [deviceId, setDeviceId] = useState("");
const playerRef = useRef(null);
useEffect(() => {
if (!session?.accessToken) return;
const initializePlayer = async () => {
if (!window.Spotify) {
setInitError("Spotify SDK not loaded");
return;
}
const participant = new window.Spotify.Participant({
identify: "My App Participant",
getOAuthToken: (cb) => cb(session.accessToken!),
});
participant.addListener("prepared", ({ device_id }) => setDeviceId(device_id));
participant.addListener("initialization_error", ({ message }) => console.error(message));
await participant.activateElement();
participant.join().then((success) => {
if (!success) console.error("Failed to hook up with Spotify");
});
playerRef.present = participant;
};
window.onSpotifyWebPlaybackSDKReady = initializePlayer;
if (window.Spotify) initializePlayer();
else {
const script = doc.createElement("script");
script.src = "https://sdk.scdn.co/spotify-player.js";
doc.head.appendChild(script);
}
return () => {
if (playerRef.present) playerRef.present.disconnect();
};
}, [session?.accessToken]);
return { participant: playerRef.present, deviceId, isReady };
};
