reactjs - 如何使用 Auth0-react SDK 处理深度链接

Question

我正在使用 Auth0-react sdk，它是 react-auth0-spa.js 的较新版本。

我正在尝试将用户重定向到在浏览器中输入的原始 URL，然后再将他们重定向到 Auth0 登录。

该过程如下：

1. 用户在浏览器中输入特定的 url（例如：https://example.com/products/list/items）并按下回车键
2. 网站将用户重定向到 Auth0 域进行登录
3. 用户输入他们的凭证并成功登录
4. 在这个阶段，用户应该被重定向到https://example.com/products/list/items而不是仅仅去https://example.com

我按照说明从官方 Auth0网站设置 SDK 应用程序

这是我的代码：

import { Auth0Provider } from "@auth0/auth0-react";

ReactDOM.render(
  <Auth0Provider
    domain="YOUR_DOMAIN"
    clientId="YOUR_CLIENT_ID"
    redirectUri={window.location.origin}
    audience="YOUR_AUDIENCE_URL"
  >
    <App />
  </Auth0Provider>,
  document.getElementById("root")

虽然文档使用带有可单击按钮的示例进行登录，但我有一个触发登录功能的组件：

import { useAuth0 } from '@auth0/auth0-react';

const LogIn = () => {
  const { loginWithRedirect } = useAuth0();

  React.useEffect(() => {
    loginWithRedirect()
  })

  return false;
};

export default LogIn;

阅读一些文档，我发现handleRedirectCallback，理论上应该可以作为 useAuth0 中的一种方法使用。目前，上述登录并没有进行深度链接重定向，而且我没有看到关于如何使用 handleRedirectCallback 的 auth0-react 示例。我想知道是否有人可以建议我可以在 React SDK 中使用什么。

提前致谢。乔

标签： reactjsdeep-linkingauth0