我有以下代碼：
export const requireAuth = (gssp: GetServerSideProps) => {
return async (ctx: GetServerSidePropsContext) => {
const { req } = ctx;
let session = null;
if (req?.headers?.cookie) {
session = await getSession(req?.headers?.cookie);
};
if (!session) {
return {
redirect: {
permanent: false,
destination: '/login',
},
};
};
return await gssp(ctx);
};
};
我也試圖在await gssp(ctx)中回傳會話，我對 NextJS 還很陌生，我無法找到任何相關資訊。
當前方法允許我通過以下方式使用此組件：
export const getServerSideProps: GetServerSideProps = requireAuth(async _ctx => {
let account;
let stats = {};
if (_ctx?.req?.headers?.cookie) {
account = await getSession(_ctx?.req?.headers?.cookie);
}
try {
const X = fetchSomeData...;
} catch (error) {
console.log('Pages/Index Fetching Error: ', error);
}
return {
props: {
account: account,
data: X,
navbar: true,
footer: true,
},
};
});
與其他 HOR 方法相比，它允許在使用它的頁面上添加額外的邏輯。
有什么辦法可以在主requireAuth組件中回傳會話而不是在每個頁面上獲取它？
uj5u.com熱心網友回復：
您可以控制高階函式傳遞給實際函式的內容，因此您可以簡單地在物件gssp中傳遞會話。ctx
export const requireAuth = (gssp: GetServerSidePropsWithSession) => {
return async (ctx: GetServerSidePropsContext) => {
const { req } = ctx;
const session = req?.headers?.cookie ? await getSession(req?.headers?.cookie) : null;
if (!session) {
return {
redirect: { permanent: false, destination: '/login' }
};
};
const ctxWithSession = { ...ctx, session };
return await gssp(ctxWithSession);
};
};
然后，您可以訪問session您的getServerSideProps代碼內部。
interface GetServerSidePropsContextWithSession extends GetServerSidePropsContext {
session?: Session;
}
type GetServerSidePropsWithSession<P extends { [key: string]: any } = { [key: string]: any }> = (
context: GetServerSidePropsContextWithContext
) => Promise<GetServerSidePropsResult<P>>;
export const getServerSideProps: GetServerSidePropsWithSession = requireAuth(async _ctx => {
const account = _ctx.session;
// Remaining code...
});
請注意，您需要擴展GetServerSideProps型別以期望該session欄位。
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/468568.html