angular - 使用 msal.js 对 Angular SPA 进行身份验证

Question

我的 Angular 应用程序有 1000 条独特的路线，用户应该能够从任何这些页面点击登录按钮。已基于此示例实现了 msal.js :

https://github.com/Gimly/simpleAngularAzureB2C/blob/master/src/app/authentication.service.ts

调用登录方法时出现以下错误:

AADB2C90006:+The+redirect+URI+' http://localhost:39579/unique-uri '+provided+in+the+request+is+not+registered+for+the+client+id+

有没有办法解决这个问题？

谢谢!

Answer 1

默认情况下，Msal.UserAgentApplication 构造函数将“redirect_uri”请求参数设置为当前 URL，这不会缩放。

Msal.UserAgentApplication 构造函数接受“redirectUri”选项参数，使“redirect_uri”请求参数能够设置为为 Azure AD B2C 应用程序注册的固定 URL(例如“http://localhost:39579/authcallback”)。

在 MSAL 生成对 Azure AD B2C 的身份验证请求之前，它会将当前 URL(例如“http://localhost:39579/unique-uri”)写入存储，然后将用户代理重定向到身份验证端点。

在“/authcallback”端点，您必须创建一个新的 Msal.UserAgentApplication 实例，以处理身份验证响应。

MSAL 验证来自 Azure AD B2C 的身份验证响应后，它会从存储中读取原始 URL，然后将用户代理返回到此 URL。