I'm trying to get a grant code and every time I make a request with my respective clientID and clientSecret I get a 400 response error and the catch statement executes:
Details: invalid_grant Invalid redirect URI
From my perspective its as if
Some posts say that the redirect URI has to be the exact same in the developer dashboard and in the request header but it gives the exact same result. Here's my current node.js file:
const express = require("express");
const cors = require("cors");
const bodyParser = require("body-parser");
const SpotifyWebApi = require("spotify-web-api-node");
const app = express();
app.use(cors());
app.use(bodyParser.json());
app.post("/login", (req, res) => {
const code = req.body.code;
const spotifyApi = new SpotifyWebApi({
redirectUri: "http://localhost:3000/",
clientId: "someCode",
clientSecret: "someCode",
});
spotifyApi
.authorizationCodeGrant(code)
.then((data) => {
res.json({
accessToken: data.body.access_token,
refreshToken: data.body.refresh_token,
expiresIn: data.body.expires_in,
});
})
.catch((err) => {
console.log(err)
res.sendStatus(400);
});
});
app.listen(3001);
This is the custom hook making the request:
import { useEffect, useState } from "react";
import axios from "axios";
export default function useAuth(code) {
const [accessToken, setAccessToken] = useState();
const [refreshToken, setRefreshToken] = useState();
const [expiresInToken, setExpiresIn] = useState();
useEffect(() => {
axios
.post("http://localhost:3001/login", {
code,
})
.then((res) => {
window.history.pushState({}, null, "/");
console.log(res.data);
})
.catch(() => {
window.location = "/";
});
}, [code]);
}