Question

我试图在authenticating specific routes的react-router网站上复制逻辑。在大多数情况下，它工作正常，但是当确定用户是否仍然被授权时，我确实遇到了问题，而确定它的逻辑本质上是异步的。下面列出的是我私人路线的组件功能。

const PrivateRoute = ({ component: Component, ...rest }) => (
  <Route {...rest} render={props => (
    isAuthenticated() ? ( 
        <Component {...props}/>
    ) : (
        <Redirect to={{
            pathname: '/login', 
            state: {from: props.location }
        }}/>
    )
  )}/>
)

这个逻辑调用我的isAuthenticated函数，它使用Amazon Cognito进行异步调用，它总是将isAuthenticated视为返回false值，即使我知道它应该返回一个真值。 isAuthenticated的代码如下所示：

const isAuthenticated = () => {
    var poolData = {
        UserPoolId : 'XXX', 
        ClientId : 'XXXX'
    };

    var userPool = new AWSCognito.CognitoIdentityServiceProvider.CognitoUserPool(poolData);
    var cognitoUser = userPool.getCurrentUser();

    if (cognitoUser != null) {
        cognitoUser.getSession(function(err, session) {
            if (err) {
                return false;
            }
            else{
                return session.isValid();
            }
        });
    }
    else{
        return false;
    }
}

如果我只是硬代码isAuthenticated返回true或false值，它在两种情况下都能正常工作。我的问题是在这种情况下是否允许异步逻辑，或者我是否应该确定此逻辑上游的身份验证状态。

Answer 1

今天早上我遇到了这个确切的问题（甚至不得不检查我是否发布了这个问题）。

我从你的问题中提示并移动了异步＆＃34; isAuthenticated＆＃34;逻辑上游，根据用户的本地存储认证结果，以两种不同的方式调用ReactDom.render（）。

我非常有兴趣听取有更好解决方案的人的意见，但我的应用程序可以通过这种方式工作。谢谢你的想法！

React Router Authenticated Routes Issue

1 个答案: