Resolving 'Insecure redirect URI' error with Spotify OAuth on HTTPS localhost using Vite and mkcert

Other Questions Spotify
1

I’m stuck with a Spotify login issue in my Electron app. The frontend runs on Vite at https://localhost:3000. I set up HTTPS locally with mkcert. My config file looks like this:

import { configureApp } from 'myAppConfig';
import ui from '@myapp/ui-plugin';
import { readFileSync } from 'fs';
import { join } from 'path';

export default configureApp({
  plugins: [ui()],
  devServer: {
    secure: {
      privateKey: readFileSync('local-private.key'),
      certificate: readFileSync('local-cert.crt'),
    },
    listenPort: 3000,
  },
});

I added https://localhost:3000/auth-response to my Spotify Developer Dashboard. But when I use this URL, I get:

INVALID_CLIENT: Insecure redirect URI

Any ideas on how to fix this? I’m really confused because I thought using HTTPS would make it secure. Help!

2

In my experience with Electron projects, the issue really comes down to Spotify’s strict handling of localhost redirect URIs. It appears that while your local server uses HTTPS for all communications, Spotify’s policy only accepts an HTTP scheme for the redirect URI when used with localhost. I managed to navigate this by keeping my secure HTTPS setup for the development server, but specifying the HTTP version in the Spotify Dashboard. Although the approach may seem contradictory, it effectively aligns the OAuth flow with Spotify’s security requirements and allows the development process to continue smoothly.

3

I’ve been through this issue before and understand the confusion. The problem isn’t your HTTPS setup—it’s that Spotify enforces a policy where HTTPS localhost URIs are not accepted for OAuth redirection. It seems that using HTTP for the redirect URI in your Spotify Dashboard is the only way to comply with their security requirements. In practice, you can continue to run your local development server with HTTPS while switching the OAuth flow to use the HTTP scheme for redirection. It’s not perfect, but it allows you to proceed with development.

4

hey noah, i had a similar issue. spotify can be picky with localhost redirects. try adding ‘http://localhost:3000/auth-response’ (without https) to ur dashboard. worked for me! also, double-check ur client ID and secret. sometimes those can cause weird errors too. good luck!