React js Spotify API request failed with status code 400

52 views Asked by At

I'm trying to pull some data using react js, axios and the Spotify API. When the user logs in, an access token is grabbed through the URL, but whenever I try to grab data through one of the API's endpoint, it gives me a status 400. It was working before but now it doesn't.

  const [profile, setProfile] = useState()
    const [token, setToken] = useState("")
    const navigate = useNavigate()

  useEffect(() => {
    const hash = window.location.hash
    let token = window.localStorage.getItem("token")

    if(!token && hash){
      token = hash.substring(1).split("&").find(elem => elem.startsWith("access_token")).split("=")[1]

      window.location.hash = ""
      window.localStorage.setItem("token", token)
    }

    setToken(token)
  }, [])

  const logout = () => {
    setToken("")
    window.localStorage.removeItem("token")
    navigate("/")

  }


  useEffect(() => {
        Axios.get("https://api.spotify.com/v1/me", {
            headers: {
                Authorization: `Bearer ${token}`
            },
          }).then((response) => {
            console.log(response.data)
            setProfile(response.data)
          })

  }, [])

I do realise this has nothing to do with axios and more to do with the API itself but I'm not sure what the problem is.

0

There are 0 answers