Question

This bounty has ended. Answers to this question are eligible for a +50 reputation bounty. Bounty grace period ends in 15 hours. ngood97 wants to draw more attention to this question:

I m looking to solve the same problem and this question hasn t received any answers.

Ideally there should be some mechanism to abort execution of child components if a gated redirect occurs.

I m 使用了13号下行路器,将用户转往日志上,如果他们没有上岸的话。页: 1 我实际上想要检查的是,如果不再发生转子,用户是否被拖入,而且只能使非布局儿童的逻辑化。

layout.tsx file:

import React from "react";
import NavBar from "@/components/nav-bar";
import { DecodedIdToken } from "firebase-admin/auth";
import { getUser } from "@/components/get-user";
import { redirect } from "next/navigation";

export default async function RecruiterLayout({
    children, // Will be a page or nested layout
}: {
    children: React.ReactNode
}) {

    const user: DecodedIdToken | null = await getUser();
    if (user === null) {
        return redirect("/auth/login");
    } else if (user.role === "recruiter" || user.role === "coordinator") {
        return redirect("/recruiter/home");
    }
    return (
        <section className="flex h-screen flex-col grow-0 overflow-y-hidden">
            <div className="flex-0 px-4 border-y"><NavBar /></div>
            <div className="flex-1 overflow-y-hidden">
                {children}
            </div>
        </section>
    )
}

正在运行的儿童网页:

import ClientComponent from "@/app/recruiter/home/components/client-component";
import getData from "@/app/api/getData";


export default async function Page() {
    // const students = await getStudents()
    const new_students = await getData({ collection_name:  users  })
    console.log(new_students);
    return (
        <ClientComponent students={new_students} />
    )
}

我的问题是,布局档案将适当将用户转至日志网页,但将仍然操作儿童page.tsx逻辑,也就是说,即使用户不作认证,数据库也可在服务器上发出。

在

是否有内在的机制或建议的模式,如果在布局一级进行改头,则停止执行页的逻辑? 或者,我是否处理过这种不同方向的逻辑?

Answer 1

鉴于你的情况,使用A/60/8 Middleware(电子功能)似乎是最佳办法。

如下文请见middleware.ts。档案:

// pages/recruiter/_middleware.ts
import { NextRequest, NextResponse } from  next/server ;
import { getUserFromRequest } from  path-to-your-auth-utils ; // Import your actual auth utilities

export async function middleware(request: NextRequest) {
    const user = await getUserFromRequest(request); // Implement this function based on your auth system

    // Check if the user is authenticated and has the correct role
    if (!user) {
        // Redirect unauthenticated users to the login page
        return NextResponse.redirect(new URL( /auth/login , request.url));
    } else if (user.role !==  recruiter  && user.role !==  coordinator ) {
        // Redirect authenticated users with incorrect roles
        return NextResponse.redirect(new URL( /unauthorized , request.url)); // Change  /unauthorized  to your preferred path
    }

    // Continue with the request if the user is authenticated and authorized
    return NextResponse.next();
}

友情链接