是否可以使用 IDP 独立代码在 ReactJS 中实现 open id connect SSO？
Is it possible to implement open id connect SSO in ReactJS with IDP independent code?
我在 ReactJS 和 .NET 5 应用程序中使用 Okta 作为主要身份提供者在 open id connect 中创建了一个 SSO。问题是，要使用 Azure Active Directory 等其他身份提供者，应该通过在 Okta 门户中进行配置来完成。我想以这样一种方式实现它，即应用程序可以连接到任何身份提供者，而不会被绑定到一个特定的身份提供者。这可能吗？如果可能的话，请告诉我应该如何进行？非常感谢任何帮助。
请注意，我不想同时连接到不同的身份提供商。
标准模式是使用授权服务器（在您的情况下为 Okta），然后确保您的应用使用基于标准的 OpenID Connect 消息连接到它。 AS 然后为您管理与其他提供商的连接，例如：
- Azure 广告
- 社交登录
- SAML 系统
您的应用随后仅使用来自 AS 的令牌，并且您可以完全控制 API 中的声明和 UI 客户端中的会话行为。
您的应用程序仍然很简单，您只需配置 AS 即可更改身份验证的工作方式，代码更改为零。
您还应该使应用程序中的代码基于标准，这样您就可以在需要时切换 AS。我倾向于通过使用开源库而不是供应商特定的库来做到这一点。
图书馆
几年前 oidc-client 是 SPA 的首选开源库：
最近，浏览器限制意味着有向 Back end for front end 方向发展的趋势。如果您正在构建新的东西，我建议您使用它。不幸的是，SPA 安全性很难：
执行此操作的正确方法是联合您希望允许的身份提供者，以便从单一事实来源[=40]管理您的用户、范围、声明等=] - 我会在下面解释很多。
这意味着选择一个身份提供者作为该真实来源（本例中为 Okta）并将辅助身份提供者连接到您的真实来源 IdP（将 Azure AD 连接到 Okta 作为联合身份提供者）。
进入细节，你想要单一真实来源的原因是因为每个生成并发送到 ReactJS 应用程序的令牌都需要由应用程序验证，以确保令牌（ s) 来自应用信任的授权服务器。
在非常精细的层面上，您的 ReactJS 应用收到的每个 OIDC id_token 和 access_token 都有一个 iss（颁发者）声明。令牌还使用非对称加密进行签名，这允许使用 public 密钥验证令牌有效负载。这让您的 ReactJS 应用程序 OIDC 库验证令牌信息是否来自可信来源 - 您已明确配置的来源。
使用多个主要身份提供者意味着应用需要配置为信任多个 iss 值并从多个 [=15] 中获取 public 键=] 端点，这不是 OIDC 客户端库实现中内置的功能。
OIDC 库假定您的令牌来自单一来源，并且 iss 和 aud 声明以及 IdP 的 jwks 端点（获取 public验证令牌签名的密钥）将对所有用户身份验证保持一致。
示例 id_token 来自 auth0 的负载：
{
"iss": "http://my-domain.auth0.com",
"sub": "auth0|123456",
"aud": "my_client_id",
"exp": 1311281970,
"iat": 1311280970,
"name": "Jane Doe",
"given_name": "Jane",
"family_name": "Doe",
"gender": "female",
"birthdate": "0000-10-31",
"email": "janedoe@example.com",
"picture": "http://example.com/janedoe/me.jpg"
}
您可以看到 public 密钥可用于验证身份验证服务器从我的域发出的令牌。auth0.com 在此端点：
https://my-domain.auth0.com/.well-known/jwks.json
我为 ReactJS 应用程序使用 oidc-client 并为 .NET 5 api 使用 IdentityServer4 来实现它。如果您想了解更多关于实现部分的信息，请查看这篇文章here.
关于将外部身份提供者连接到IdentityServer4，你可以参考这个documentation
我在 ReactJS 和 .NET 5 应用程序中使用 Okta 作为主要身份提供者在 open id connect 中创建了一个 SSO。问题是，要使用 Azure Active Directory 等其他身份提供者，应该通过在 Okta 门户中进行配置来完成。我想以这样一种方式实现它，即应用程序可以连接到任何身份提供者，而不会被绑定到一个特定的身份提供者。这可能吗？如果可能的话，请告诉我应该如何进行？非常感谢任何帮助。
请注意，我不想同时连接到不同的身份提供商。
标准模式是使用授权服务器（在您的情况下为 Okta），然后确保您的应用使用基于标准的 OpenID Connect 消息连接到它。 AS 然后为您管理与其他提供商的连接，例如：
- Azure 广告
- 社交登录
- SAML 系统
您的应用随后仅使用来自 AS 的令牌，并且您可以完全控制 API 中的声明和 UI 客户端中的会话行为。
您的应用程序仍然很简单，您只需配置 AS 即可更改身份验证的工作方式，代码更改为零。
您还应该使应用程序中的代码基于标准，这样您就可以在需要时切换 AS。我倾向于通过使用开源库而不是供应商特定的库来做到这一点。
图书馆
几年前 oidc-client 是 SPA 的首选开源库：
最近，浏览器限制意味着有向 Back end for front end 方向发展的趋势。如果您正在构建新的东西，我建议您使用它。不幸的是，SPA 安全性很难：
执行此操作的正确方法是联合您希望允许的身份提供者，以便从单一事实来源[=40]管理您的用户、范围、声明等=] - 我会在下面解释很多。
这意味着选择一个身份提供者作为该真实来源（本例中为 Okta）并将辅助身份提供者连接到您的真实来源 IdP（将 Azure AD 连接到 Okta 作为联合身份提供者）。
进入细节，你想要单一真实来源的原因是因为每个生成并发送到 ReactJS 应用程序的令牌都需要由应用程序验证，以确保令牌（ s) 来自应用信任的授权服务器。
在非常精细的层面上，您的 ReactJS 应用收到的每个 OIDC id_token 和 access_token 都有一个 iss（颁发者）声明。令牌还使用非对称加密进行签名，这允许使用 public 密钥验证令牌有效负载。这让您的 ReactJS 应用程序 OIDC 库验证令牌信息是否来自可信来源 - 您已明确配置的来源。
使用多个主要身份提供者意味着应用需要配置为信任多个 iss 值并从多个 [=15] 中获取 public 键=] 端点，这不是 OIDC 客户端库实现中内置的功能。
OIDC 库假定您的令牌来自单一来源，并且 iss 和 aud 声明以及 IdP 的 jwks 端点（获取 public验证令牌签名的密钥）将对所有用户身份验证保持一致。
示例 id_token 来自 auth0 的负载：
{
"iss": "http://my-domain.auth0.com",
"sub": "auth0|123456",
"aud": "my_client_id",
"exp": 1311281970,
"iat": 1311280970,
"name": "Jane Doe",
"given_name": "Jane",
"family_name": "Doe",
"gender": "female",
"birthdate": "0000-10-31",
"email": "janedoe@example.com",
"picture": "http://example.com/janedoe/me.jpg"
}
您可以看到 public 密钥可用于验证身份验证服务器从我的域发出的令牌。auth0.com 在此端点： https://my-domain.auth0.com/.well-known/jwks.json
我为 ReactJS 应用程序使用 oidc-client 并为 .NET 5 api 使用 IdentityServer4 来实现它。如果您想了解更多关于实现部分的信息，请查看这篇文章here.
关于将外部身份提供者连接到IdentityServer4，你可以参考这个documentation