Couldn't get back in my app once i'm login in with spotify

user_9634814 0
Viewed 666

I'm creating an app which need to link the user Spotify account in order to get his music library. To do so i'm using expo on react native and with it, the package "expo-auth-session"

It already got a pretty good example to manage the connection with spotify.

Unfortunately once i'm on the spotify login page, I can't get back on my app. I think the problem come from the "redirectUri" which I don't really understand how it works. I've seen that you should place there your redirection (which is usually something like https://localhost:8000/ ) but i'm working on Mobile, so there's no such things. I've seen that you should create a RedirectUri callback as well on the Spotify Dashboard but even that doesn't seems to work.

If you guys got some more informations about this it would be great !

My dev :

const endPoints = {
authorizationEndpoint: "https://accounts.spotify.com/authorize",
tokenEndpoint: "https://accounts.spotify.com/api/token",};


const [request, response, promptAsync] = useAuthRequest(
    {
        clientId: "My-Client-ID",
        scopes: ["user-library-read"],
        // In order to follow the "Authorization Code Flow" to fetch token after authorizationEndpoint
        // this must be set to false
        usePKCE: false,
        // For usage in managed apps using the proxy

        redirectUri: "exp://localhost:19000",
    },
    endPoints
);
expo react-native spotify authentication
1 Answers

I'll update the docs, but here is how you should configure your redirect URIs for Spotify:

  • Setup your redirect URIs: Your project > Edit Settings > Redirect URIs
    • Proxy: https://auth.expo.io/@username/slug
      • If useProxy is enabled (native only), change username for your Expo username and slug for the slug in your app.json. Try not to change the slug for your app after using it for auth as this can lead to versioning issues.
    • Expo Go: exp://localhost:19000/--/
    • Web dev: https://localhost:19006
      • Important: Ensure there's no slash at the end of the URL unless manually changed in the app code with makeRedirectUri({ path: '/' }).
      • Run expo start:web --https to run with https, auth won't work otherwise.
    • Custom app: your-scheme://
      • Scheme should be specified in app.json expo.scheme: 'your-scheme', then added to the app code with makeRedirectUri({ native: 'your-scheme://' }))
    • Web production: https://yourwebsite.com
      • Set this to whatever your deployed website URL is.

If the redirect URIs are not setup then Spotify won't know where to direct the app after authentication completes, this causes the "stuck" effect you're experiencing.

user_40479260
Related