我有一个 React SPA，并且有一个自定义登录页面。目前我们在 AWS 上，使用 AWS Cognito 来获取访问 token 。
基本上，当用户第一次访问网站时，当前端代码加载到浏览器中时，它很快就会判断出没有访问 token 。因此，仅呈现自定义登录页面。
然后用户输入密码和用户名，然后 AWS Cognito 返回访问 token 和 ID token 。这是代码:
import { Auth } from 'aws-amplify';
...
// login
const user = await Auth.signIn(formData.username, formData.password);
现在，由于 token 存在于浏览器中，前端代码将呈现用户仪表板。
我们现在正在尝试迁移到 Azure。在 Azure B2C MSAL documentation ，介绍了使用JavaScript SDK登录的方法:
Sign-in
MSAL.js exposes 3 login APIs: loginPopup(), loginRedirect() and ssoSilent()
但是，他们有 Azure 编写的弹出窗口或重定向网页。我不想使用 Azure 编写的前端代码，也不想自定义这些给定的登录页面。
我想继续使用原来的自定义编写的登录页面，我只需要一个 Azure API，我可以在其中提供用户名和密码并获取访问权限和 ID token ，就像使用 AWS Cognito/AWS-Amplify 一样。
我怎样才能做到这一点？
最佳答案
You can make use of ROPC flow to sign in users just by entering username and password without involving any user interaction.
我注册了一个 Azure AD B2C 应用程序并启用了“允许公共(public)客户端流”，如下所示:
现在，通过将 oauth2AllowImplicitFlow 属性设置为 true 来修改应用程序的 Manifest，如下所示:
我在 B2C 租户中创建了一个 ROPC 用户流，如下所示:
我使用 ROPC 流程通过 Postman 成功获取了访问 token ，参数如下:
POST https://<b2ctenant_name>.b2clogin.com/b2ctenant.onmicrosoft.com/B2C_1_ROPC_Auth/oauth2/v2.0/token
username: <a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="f8999c959196b88b8a91958c9aca9bd6979695919b8a978b979e8cd69b9795" rel="noreferrer noopener nofollow">[email protected]</a>
password:xxxxxxx
grant_type:password
scope:openid e386646b-a4f8-42fb-aa0a-0xxxxxxxx offline_access
client_id:e386646b-a4f8-42fb-aa0a-0xxxxxxxxxxx
回应:
您可以使用上面的刷新 token 来更新 token ，如下所示:
POST https://<b2ctenant_name>.b2clogin.com/b2ctenant.onmicrosoft.com/B2C_1_ROPC_Auth/oauth2/v2.0/token
grant_type:refresh_token
client_id:e386646b-a4f8-42fb-aa0a-0xxxxxxxxx
resource:e386646b-a4f8-42fb-aa0a-0xxxxxxxxx
refresh_token: <refresh_token_from_above_step>
回应:
当我在jwt.ms中解码上面的ID token 时，我得到了以下声明:
请注意，您只能对本地帐户使用 ROPC 流。如果您使用外部身份提供商进行身份验证，这将不起作用。由于此流程涉及泄露用户密码，因此在生产中实现它并不安全。
引用:
Set up a resource owner password credentials flow - Azure AD B2C | Microsoft
关于Azure B2C登录: how to get access token in React SPA and without using the Azure login pop or login page?，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/76549638/