如何使用新的 auth0-spa.js 在不单击登录按钮的情况下重定向到 auth0？

Posted 2023-03-09

【中文标题】如何使用新的 auth0-spa.js 在不单击登录按钮的情况下重定向到 auth0？

【英文标题】：How can I redirect to auth0 without clicking on the Log In button in react using the new auth0-spa.js?

【发布时间】：2020-05-02 17:46:51

【问题描述】：

我正在使用新的 auth0-spa 并按照它的教程来实现 auth0 here 提供的 auth0 SDK。 我想自动重定向到 auth0 登录页面，而不是提供登录按钮的页面。 谁能帮我？ 这是我的代码

import PrivateRoute from "./PrivateRoute";
import React,useState from "react";
import  useAuth0  from "../react-auth0-spa";
import BrowserRouter, HashRouter, Link, Route, Router, Switch from "react-router-dom";
import DefaultLayout from "../containers/DefaultLayout";
import history from "../utils/history";
const NavBar = () => 
const  isAuthenticated, loginWithRedirect, logout  = useAuth0();

return (

<div>
  !isAuthenticated && (
    <button id="button" onClick=() => loginWithRedirect()>Log in</button>
  )

  isAuthenticated && (
    <HashRouter history = history>
      <Switch>
        <PrivateRoute path="/" component=DefaultLayout/>
      </Switch>
    </HashRouter>
  )
</div>
);
;

export default NavBar;

【问题讨论】：

嘿，你找到解决办法了吗？

【参考方案1】：

这就是我所做的：

const App: React.FC<> = () => 

    const  isLoading, loginWithRedirect, user  = useAuth0();

    useEffect(() => 
      (async function login() 
        if (!isLoading && !user) 
          await loginWithRedirect();
        
      )();
    , [isLoading]);

    return (
      <React.Fragment>
        /* your code */
      </React.Fragment>
    )