如何使用Next Auth和KeyCloak提供商添加多租户

发布于 2025-01-31 12:54:50 字数 1372 浏览 2 评论 0原文

我一直在尝试使用 next-auth 和 keycloak 在一起，但是我使用多键登录时，我使用单个keycloak提供商时我无法更改clientsecret和发行者在运行时的选项，因此我尝试添加每个领域中使用不同的id的倍数keycloak提供商，它可以使用，我可以使用React Hook选择正确的领域：

[... NextAuth] .TS

const realms = [
    {
        id: 'abc',
        clientId: 'nextjs',
        clientSecret: 'asfasdfdfasdfdasfasfddsf',
        issuer: 'http://localhost:8080/realms/abc',
    },
    {
        id: 'xyz',
        clientId: 'nextjs',
        clientSecret: 'ssdfsdfsdfasdfasdfasdfasfdsdf',
        issuer: 'http://localhost:8080/realms/xyz',
    }
];

提供商：

    export default NextAuth({
    providers: realms.map((realm) => KeycloakProvider({
        id: realm.id,
        clientId: realm.clientId,
        clientSecret: realm.clientSecret,
        issuer: realm.issuer
    })),
});

我最大的问题是我不能在运行时包括更多的提供商/领域配置，如果我可以使用安全的终点来获取这些KeyCloak Configs ...如果有人可以帮助我，向我展示一些指南如何实现它，那么欢迎任何帮助！

我是NextJs的新手，您可以检查我的全项目code

原文

I've been trying to use next-auth and keycloak together, but I'm falling when using multi-realms login, using a single keycloak provider I couldn't change clientSecret and issuer options at runtime, so I tried to add multiples keycloak providers with a different id per realm, it works and I can use the react hook to select the right realm:

[...nextauth].ts

const realms = [
    {
        id: 'abc',
        clientId: 'nextjs',
        clientSecret: 'asfasdfdfasdfdasfasfddsf',
        issuer: 'http://localhost:8080/realms/abc',
    },
    {
        id: 'xyz',
        clientId: 'nextjs',
        clientSecret: 'ssdfsdfsdfasdfasdfasdfasfdsdf',
        issuer: 'http://localhost:8080/realms/xyz',
    }
];

providers:

    export default NextAuth({
    providers: realms.map((realm) => KeycloakProvider({
        id: realm.id,
        clientId: realm.clientId,
        clientSecret: realm.clientSecret,
        issuer: realm.issuer
    })),
});

My biggest problem is that I can't include more providers/realms configurations at runtime, it would be nice if I could use an secure end-point to fetch those keycloak configs... so if someone could help me out, showing me some guide how to achieve it, any help is welcome!

My I'm pretty new to NextJS and you can check my full-project-code

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

陪你到最终 2025-02-07 12:54:50

好的，我找到了一个似乎有效的解决方案！
在[... NextAuth] .TSX文件中，而不是直接导出NextAuth函数，而是像其他任何API一样使用处理程序，然后您可以动态控制提供商。例子：

export default async function handler(req, res) {
  // getCustomers is a custom function that gets all your customers from the database or wherever
  const customers = await getCustomers() 
  
  // Build a list of all the providers
  const providers = customers.map(customer => KeycloakProvider({
    id: ...
    name: ...
    ...
  }))

  // Return the same NextAuth function, but pass the req and res parameters so it can return the response
  return NextAuth(req, res, {
    providers,
    pages: {
      ...
    }    
    ...
  })
}

Ok I found a solution that seems to work!
In the [...nextauth].tsx file, instead of directly exporting the NextAuth function, use a handler just like any other api, and then you can control the providers dynamically. Example:

export default async function handler(req, res) {
  // getCustomers is a custom function that gets all your customers from the database or wherever
  const customers = await getCustomers() 
  
  // Build a list of all the providers
  const providers = customers.map(customer => KeycloakProvider({
    id: ...
    name: ...
    ...
  }))

  // Return the same NextAuth function, but pass the req and res parameters so it can return the response
  return NextAuth(req, res, {
    providers,
    pages: {
      ...
    }    
    ...
  })
}

回复收藏 0 原文

~没有更多了~