reactjs - 当 Oauth 重定向 url 发送 url 时，ReactRouter 不起作用

Question

我正在尝试使用 create-react-app 中的外部 OAuth2 webview 对用户进行身份验证。

成功后，外部 webview 使用我提到的重定向 uri 作为回调并添加查询参数。（例如：http://localhost:3000/auth/connector?code=pKH7q4 .....Gk

我正在使用 ..... 隐藏真正的字符串值。

然后这个回调 uri 应该由 reactrouter 处理，但得到了这个消息：

网站不可用

我只需要在浏览器 url 输入中按 F5 或 Enter 就可以让 reactrouter 很好地处理它。

我无法弄清楚在 /auth/connector 路由中正确输入的内容，而无需在浏览器 url 输入中按 enter。

有什么建议吗？

import { Button, Link } from "@material-ui/core";
import ClientOAuth2 from "client-oauth2";

export const LoginPage = () => {
   const uid = "yovbQyXFx.....zg7uGVfuThU";
   const redirectUrl = "http://localhost:3000/auth/connector";
   const secret = "NVnl.....Ao6uACg";
   const sorareAuth = new ClientOAuth2({
     clientId: uid,
     clientSecret: secret,
     accessTokenUri: "https://connector.com/oauth/token",
     authorizationUri: "https://connector.com/oauth/authorize",
     redirectUri: redirectUrl,
   });
    
   return (
     <div id="loginPage">
       <Button variant="contained" color="primary">
         <Link href={oAuthConnectorUri()}>Connection Oauth2</Link>
       </Button>
     </div>
   );
};

import React from "react";
import { Switch, Redirect, Route } from "react-router-dom";
import { HomePage } from "../views/pages/home/HomePage";
import { LoginPage } from "../views/pages/login/LoginPage";

export const RouterComponent: React.FC = (props) => {
  return (
    <Switch>
      <Route exact path="/">
        <Redirect to="/home" />
      </Route>
      <Route exact path="/home">
        <HomePage />
      </Route>
      <Route exact path="/auth/login">
        <LoginPage />
      </Route>
      <Route path="/auth/connector">
        <HomePage />
      </Route>
    </Switch>
  );
};

• 反应路由器域：5.2.0
• 客户端 oauth2：4.3.3

标签： reactjsoauth-2.0create-react-appreact-router-dom