Next.js/Next-Auth/Apollo/GraphQL Setup



我正在寻找关于如何使用Apollo和GraphQL访问PostgreSQL数据库的next.js前端的建议。我认为将前端和后端分开是有意义的,但我意识到存在权衡。Next.js和NextAuth.js在使用Next.js API功能时似乎设计得很好。

一些要求:

  1. 数据需要根据用户(public, internal, admin)进行限制。
  2. 使用Google OAuth登录

考虑到这一点,如果你想让后端知道用户的访问权限,NextAuth.js会变得更复杂。

然而,如果我的apollo/graphql后端是独立的,那么肯定会有如下好处:

  1. 如果需要的话,我可以换掉前端所以有一些灵活性
  2. 代码和依赖项可能比前后端组合更简单

我目前的挑战是,我有NextAuth.js工作在Next.js应用程序,但我还没有弄清楚如何控制数据访问。到目前为止,我得到的最好的想法是混合了NextAuth.js和我的后端的某种令牌管理。这似乎不是NextAuth.js的设计方式,所以我正在重新思考整个架构并寻求建议。

谢谢!

我在这里找到了一个关于类似问题的非常简短的讨论,但我很想听听其他人是如何处理这个问题的。如何转发用户会话在Next.js + Graphql解耦架构?

我将尽我所能给出一个相当通用的答案,使用JWT进行授权,但由于我对Google OAuth不是很熟悉,因此我将不得不做一些假设;相关的Google系统

首先,也是最重要的,澄清身份验证或"你是谁"之间的区别是很重要的。和授权,或者"你可以做什么">

到目前为止,我得到的最好的想法是某种令牌管理,它混合了NextAuth.js和我的后端。这似乎不是NextAuth.js的设计方式,所以我正在重新思考整个架构并寻求建议。

NextAuth是一个身份验证库,不支持NextAuth创建的jwt的外部验证,所以你不希望将NextAuth与后端混合使用是正确的。当有人登录NextAuth时,创建一个特定于NextAuth的JWT(一个ID令牌),该JWT将在客户端和下一个服务器之间传递。它告诉您用户是谁,并证明他们已经登录。除非你正在使用数据库会话,我没有使用过,所以不能说话。

需要额外的工作来实现授权,以便您拥有一个JWT,该JWT还描述了用户具有的访问权限,您可以将其传递到后端。

理想情况下,你将能够利用谷歌OAuth为此,假设是这种情况,这就是我要做的:

对于架构

  • 我不是很熟悉GraphQL/Apollo,但分离似乎很好。但需要注意的是,不分离也可能是好的。任何方法都有权衡,所以你必须评估哪种方法最适合你的情况。
  • 无论何时你对后端进行调用,你都要以Bearer <token>的形式传递你的JWT作为Authorization头。
  • 在后台,然后,您验证令牌与每个传入呼叫,并允许呼叫继续(或不)适当。

这是我在阿波罗文档中找到的相关信息。

对于令牌

在你的NextAuth提供程序配置中,在jwt回调中,你可以向NextAuth jwt添加信息。

理想情况下,您的Google OAuth为您提供JWT(访问令牌)。这应该是在后端相对容易验证的内容,并且它是您想要用于授权的内容。

您可以在用户首次登录时将此Google OAuth JWT(访问令牌)存储在NextAuth JWT (id令牌)中,然后在调用GraphQL后端之前在Next.js服务器上检索它。它看起来像这样:

// [...nextauth].js
const options = {
// ... other configuration
callbacks: {
jwt: async (token, user, account, profile, isNewUser) => {
const isSignIn = !!user
if (isSignIn) {
token.b2c = {
accessToken: account.accessToken,
refreshToken: account.refreshToken,
iat: profile.iat,
exp: profile.exp,
}
}
return Promise.resolve(token)
}
}
}

这是我使用的配置中的一个简化示例。我的配置是针对Azure AD B2C的,但它与您正在寻找的一般流程相同。您可以在这里看到我的完整配置,其中显示了我用来处理根据需要刷新访问令牌的一些额外代码。

如果你没有从Google OAuth流中可用的东西,这将变得更加复杂,你必须构建一些自定义的东西。

相关内容

  • 没有找到相关文章

最新更新