Javascript Spotify身份验证在完成后不重定向中使用隐式授权

我想在他们的文档中使用隐式授权方法完成Spotify身份验证。我已将似乎相关的代码复制到React组件中。 我设法登录到Spotify，但是页面没有重定向回重定向uri

我已将URI添加到web控制台的列表中，但即使我使用了未注册的URI，也不会显示错误。它甚至没有尝试重定向

如何在验证后使其重定向

组件是页面上唯一呈现的内容：

import React from "react";

const stateKey = "spotify_auth_state";

const SpotifyLogin = class extends React.Component {
  ComponentDidMount() {
    localStorage.removeItem(stateKey);
  }

  handleClick = () => {
    const client_id = "e5abbee6e0fd4e4bbd080c6d212ca520";
    const redirect_uri = "http://localhost:3000";
    const scope = "user-read-private user-read-email";
    const state = generateRandomString(16);

    localStorage.setItem(stateKey, state);

    const url = `https://accounts.spotify.com/authorize
                 ?response_type=token
                 &client_id=${encodeURIComponent(client_id)}
                 &scope=${encodeURIComponent(scope)}
                 &redirect_uri=${encodeURIComponent(redirect_uri)}
                 &state=${encodeURIComponent(state)}`;

    window.location = url;
  };

  render() {
    return <button onClick={this.handleClick}>Log in</button>;
  }
};

const generateRandomString = length => {
  let text = "";
  const possible =
    "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

  while (text.length <= length) {
    text += possible.charAt(Math.floor(Math.random() * possible.length));
  }

  return text;
};

export default SpotifyLogin;

从“React”导入React；
const stateKey=“spotify\u auth\u state”；
const SpotifyLogin=类扩展了React.Component{
ComponentDidMount（）{
localStorage.removietem（stateKey）；
}
handleClick=（）=>{
const client_id=“e5abbee6e0fd4e4bbd080c6d212ca520”；
const redirect_uri=”http://localhost:3000";
const scope=“用户读取私人用户读取电子邮件”；
const state=generateRandomString（16）；
setItem（stateKey，state）；
常量url=`https://accounts.spotify.com/authorize
？响应类型=令牌
&客户端id=${encodeURIComponent（客户端id）}
&scope=${encodeURIComponent（scope）}
&重定向\u uri=${encodeURIComponent（重定向\u uri）}
&state=${encodeURIComponent（state）}`；
window.location=url；
};
render（）{
返回登录；
}
};
const generateRandomString=长度=>{
让文本=”；
常数可能=
“ABCDEFGHIJKLMNOPQRSTUVWXYZABCDFGHIJKLMNOPQRSTUVXYZ0123456789”；
而（text.length问题在于我使用了多行字符串模板。这使得字符串有多行，并且没有将字符串连接成一行

修正：

您是否将重定向uri放入spotify应用程序的白名单中？是的，但即使使用未列入白名单的uri也会产生相同的效果。它甚至不会出现无效uri错误。
let url = "https://accounts.spotify.com/authorize";
url += "?response_type=token";
url += `&client_id=${encodeURIComponent(client_id)}`;
url += `&scope=${encodeURIComponent(scope)}`;
url += `&redirect_uri=${encodeURIComponent(redirect_uri)}`;
url += `&state=${encodeURIComponent(state)}`;