getServerSideProps中的nextjs & next-auth getSession()与HTTPS不起作用

kyxcudwk  于 2023-05-06  发布在  其他
关注(0)|答案(2)|浏览(141)

我不能在getServerSideProps中使用getSession()和HTTPS。
正常吗?我试过很多次。
如果使用HTTPS,我会得到它。我无法在getServerSideProps中使用getSession()

__Secure-next-auth.callback-url
__Secure-next-auth.session-token
__Host-next-auth.csrf-toke

如果使用HTTP,我可以在getServerSideProps中使用getSession()

next-auth.callback-url
next-auth.session-token
next-auth.csrf-token

如何在getServerSideProps中的HTTPS getSession()上修复它?
我在http或https上运行相同的代码进行测试
如果使用http运行,我可以获得props.session如果使用https运行,我无法获得props.session

import { getSession } from 'next-auth/client';

export default function Home(props) {
  console.log(props.session);
  return (
    <div>
      <h1>Server Side Rendering</h1>
    </div>
  );
}
export async function getServerSideProps(context) {
  return {
    props: {
      session: await getSession(context),
    },
  };
}

备注:
1.我在.env中设置了NEXTAUTH_URL
1.我知道我可以在getInitialProps中获得getSession(),但我需要获得session.user.id来使用prisma获取数据库,同时prisma需要在getServerSideProps中运行

zi8p0yeb

zi8p0yeb1#

这种行为是正常的。这些值是next-auth的内部值。当NEXTAUTH_URL前缀为https时,cookie将被标记为安全。你可以看到这里的行为:
https://github.com/nextauthjs/next-auth/blob/543f812eb32448044d2aa725b623ca1dedbb68a3/src/lib/jwt.js#L115
在内部,next-auth将处理会话,而不考虑httphttps
要配置客户端会话,您可以按照文档中的示例操作:

  • https://next-auth.js.org/getting-started/client#usesession
  • https://next-auth.js.org/getting-started/client#provider

这里有一个完整的工作示例:

首先配置提供程序,以便在组件之间共享会话。
pages/_app.js

import { Provider } from "next-auth/client"

export default function App({ Component, pageProps }) {
  return (
    <Provider session={pageProps.session}>
      <Component {...pageProps} />
    </Provider>
  )
}

如果在服务器端呈现期间也需要支持身份验证,则需要。
pages/index.js

import { getSession } from "next-auth/client"

export async function getServerSideProps(ctx) {
  return {
    props: {
      session: await getSession(ctx)
    }
  }
}

在组件内部使用next-auth提供的react钩子

import { useSession } from "next-auth/client"

export default function Component() {
  const [session, loading] = useSession()

  if (session) {
    return <p>Signed in as {session.user.email}</p>
  }

  return <a href="/api/auth/signin">Sign in</a>
}

在服务器端的API路由中:

import { getSession } from "next-auth/client"

export default async (req, res) => {
  const session = await getSession({ req })
  res.end()
}
r1zhe5dt

r1zhe5dt2#

使用“next 13.3.4”,“next-auth 4.22.1”“react 18.2.0”,以下内容似乎可以正常工作:

import { GetServerSideProps, InferGetServerSidePropsType } from 'next';
import { getSession } from 'next-auth/react';
import { findUser } from '@/lib/prisma';

export default function Example({ profile: user }:
    InferGetServerSidePropsType<typeof getServerSideProps>)
{
    if (!user) {
        return (
            <>
            <h1>Server-Error</h1>
            <p>Please try again later.</p>
            </>
        )
    }
    //...
    return (
        <>
        <h1>Profile {user.firstname}</h1>
        </>
    );
}

type ProfileSettings = {
    firstname: string,
    middlename: string | null,
    lastname: string,
    nickname: string | null,
    email: string,
};

type ProfileData = {
    profile: ProfileSettings | null
};

export const getServerSideProps:GetServerSideProps<ProfileData> = async (context) => {
    var session = await getSession(context);
    var p: ProfileSettings|null = null;
    if (session?.user?.name) {
        let u = await findUser(session.user.name);
        if (u)
            p = {
                account: u.account,
                firstname: u.firstname,
                lastname: u.lastname,
                nickname: u.nickname,
                email: u.email
            };
    }
    return { props: { profile: p }};
}

相关问题