我们在 MS Teams 桌面和移动应用程序中的 Web 应用程序（node.js + angular 10）面临 AAD 登录问题，而我们的用户通过单击任何 Web 浏览器或 MS Teams Web 客户端中的登录按钮轻松登录。
在 Angular 中，我们使用两个库（@azure/msal-browser msal 和 @azure/msal-common）并通过登录我们的应用程序使用 AAD 图形工具包。
在登录页面中，我们只是通过一个简单的登录按钮调用登录组件。我们将 Angular Web 应用程序添加为 MS Teams 的个人选项卡/应用程序。当用户在 Microsoft Teams 桌面应用程序中单击它时，我们在控制台中遇到以下错误消息：
ERROR Error: Uncaught (in promise): BrowserAuthError: redirect_in_iframe:
Code flow is not supported inside an iframe. Please ensure you are using MSAL.js in a top frame of the window if using the redirect APIs, or use the popup APIs. (window.parent !== window) => true
BrowserAuthError: redirect_in_iframe: Code flow is not supported inside an iframe. Please ensure you are using MSAL.js in a top frame of the window if using the redirect APIs, or use the popup APIs. (window.parent !== window) => true at t [as constructor]
我们假设 Teams Desktop 选项卡无法打开我们的身份验证机制，因为我们无法在函数下方添加代码：
microsoftTeams.initialize(() => {
microsoftTeams.authentication.authenticate({
url: config.BASE_URL + '/app/microsoft-teams/tabs/auth',
width: 600,
height: 535,
successCallback: onAuthSuccess,
failureCallback: onAuthFailure,
});
});
这是来自团队 SDK javascript，我们没有弄清楚如何在 Angular 10 结构中使用此函数，我们无法从 Angular 中的任何包中调用该函数。
Angular 10 应用程序是否有解决方法来利用诸如 microsoftTeams.authentication.authenticate 之类的功能？ms团队等的任何打字稿包？
我们是否必须使用 React 创建一个外部 Teams-spesific-login 流应用程序（如这些代码：https ://github.com/AzureAD/microsoft-authentication-library-for-js/issues/2531#issuecomment-770110059 ）和调用 ms 团队 js sdk 包以通过此 React 应用程序对用户进行身份验证，然后最终使用获得的令牌将用户重定向到我们的 Angular 10 应用程序？对于这种情况，这种方法是最好的情况还是最好的解决方法？
是否有任何方法可以仅在一个 Angular 10 独立应用程序和一种登录机制中继续使用浏览器、团队桌面应用程序、团队移动应用程序？我找到了这个主题（https://github.com/OfficeDev/microsoft-teams-library-js/issues/90），但不知道如何使用它来解决我的问题。