0

所以基本上我在我的项目中使用 Next.js 并且遇到了一些麻烦。

我在使用 redux 的项目中进行了身份验证。在我的登录页面中有一个 if 条件检查是否isAuthenticated为真（isAuthenticated来自我的 redux 商店）。如果是真的，那么下一个路由器会router.push('/');。这很好，但是当我查看主页的页面源时，它仍然将登录页面显示为源页面。为什么是这样？

我还将我的主页包装在一个管理高阶组件的路由中，该组件检查用户身份验证，也来自 redux，在getInitialProps. 再次路由，一切正常，只是源页面仍然显示登录页面。我是下一个新手，所以我不知道出了什么问题。

这是来自登录页面的重定向。

import Router from 'next/router';
// ...
if (isAuthenticated) {
    Router.push("/");
}

这是路线管理器。

const isAuthenticated = store.getState().auth.isAuthenticated;

AuthPage.getInitialProps = async (ctx) => {
    if (routeType === "authenticator") {
        if (isAuthenticated) {
            if (typeof window === "undefined") {
                ctx.res.writeHead(302, { location: "/" });
                ctx.res.end();
            } else {
                const router = useRouter();
                router.push("/");
            }
        }
    } else if (routeType === "private") {
        if (!isAuthenticated) {
            if (typeof window === "undefined") {
                ctx.res.writeHead(302, { location: "/login" });
                ctx.res.end();
            } else {
                const router = useRouter();
                router.push("/login");
            }
        }
    }

    if (Component.getInitialProps) {
        const authProps = await Component.getInitialProps({
            ...ctx,
            auth: isAuthenticated,
        });
        return { ...authProps, isAuthenticated };
    }

    return { isAuthenticated };
};

return AuthPage;
4

0 回答 0