reactjs - 如何在反应路由器中使用回调 uri 处理身份验证

Question

我创建了我的第一个 react 应用程序，它使用 spotify api 来显示数据，但是我在将其部署到 netlify 或任何服务器 Te 身份验证流程时遇到问题： 1. 用户单击我的应用程序上的按钮，将他重定向到 spotify/auth 2. Spotify 身份验证检查权限和提示登录按钮，成功后将用户重定向到我的应用程序的 URL，最后使用 /localhost 3. 我使用反应路由器和切换组件来处理 /callback 路由并保存令牌和一切在 localhost 上它工作得很好，但在当 spotify 将用户发送到 /callback 时，live-server 或 netlify 出现错误

这是我设置的反应路线

它说“无法获取/回调”

 <Router>
    <Provider store={store}
        <Switch>
          <Route exact path="/" component={LoginView} />
          <Route exact path="/callback" component={CallBack} />
          <PrivateRoute path="/app">
            <AppView />
          </PrivateRoute>
        </Switch>
    </Provider>
  </Router>

这是用户单击登录按钮时启动的功能：

  handleLogin = () => {
// redirect user to spotify to authenticate them
const params = queryString.stringify({
  client_id: "client_id,
  response_type: "token",
  redirect_uri: `${window.location.origin}/callback`,
  scope: "user-top-read playlist-modify-public playlist-modify-private",
});
window.location = `https://accounts.spotify.com/authorize?${params}`;

我真的不明白为什么它会这样工作

标签： reactjsserveroauthroutesreact-router