·您可以尝试使用重定向方法登录，该方法使用MSAL React Wrapper元素，该元素允许您通过将特定组件 Package 在**'MsalAuthenticationTemplate'**组件中来保护这些组件。如果用户尚未登录，则此组件将调用登录，否则将呈现子组件。

‘ import { InteractionType } from "@azure/msal-browser";
    import { MsalAuthenticationTemplate, useMsal } from "@azure/msal-react";

    function WelcomeUser() {
const { accounts } = useMsal();
const username = accounts[0].username;

return <p>Welcome, {username}</p>
}

 // Remember that MsalProvider must be rendered somewhere higher up in the component tree
 function App() {
return (
    <MsalAuthenticationTemplate interactionType={InteractionType.Redirect}>
        <p>This will only render if a user is signed-in.</p>
        <WelcomeUser />
    </MsalAuthenticationTemplate>
  )
    }; ’

此外，完成上述操作以允许Azure AD B2C MSAL身份验证后，请确保已允许Azure AD B2C应用程序注册中的隐式授权流，并已添加自定义公共客户端协议作为重定向URI，如**'company：//auth'或'msal：//redirect'。而用于本地开发的'ADAL config'**应如下所示：-

‘ adalConfig: {
tenant: 'XXXXXXXXXXX',
clientId: 'XXXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX',
redirectUri: 'company://auth'
} ’

·由于用户交互（如按钮单击）而调用登录的建议方法是使用**'@ azure/msal-browser'**直接与 AuthenticatedTemplate 和/或 UnauthenticatedTemplate 组件配对，以分别向登录或注销用户呈现特定内容，如下例所示：-

‘ import { useMsal, AuthenticatedTemplate, UnauthenticatedTemplate } from "@azure/msal-react";

   function signInClickHandler(instance) {
    instance.loginRedirect();
  }

   // SignInButton Component returns a button that invokes a popup login when clicked
   function SignInButton() {
  // useMsal hook will return the PublicClientApplication instance you provided to MsalProvider
const { instance } = useMsal();

return <button onClick={() => signInClickHandler(instance)}>Sign In</button>
 };

  function WelcomeUser() {
const { accounts } = useMsal();
const username = accounts[0].username;

return <p>Welcome, {username}</p>
 }

  // Remember that MsalProvider must be rendered somewhere higher up in the component tree
  function App() {
   return (
    <>
        <AuthenticatedTemplate>
            <p>This will only render if a user is signed-in.</p>
            <WelcomeUser />
        </AuthenticatedTemplate>
        <UnauthenticatedTemplate>
            <p>This will only render if a user is not signed-in.</p>
            <SignInButton />
        </UnauthenticatedTemplate>
       </>
       )
    } ’

·因此，通过遵循以上指定的修改，您应该能够正确地将Azure AD B2C与电子React应用程序集成，因为电子应用程序使用javascript作为其基础。请参阅以下链接了解更多信息：-
https://learn.microsoft.com/en-us/azure/active-directory/develop/scenario-spa-sign-in?tabs=react#sign-in-with-redirect
https://github.com/AzureAD/microsoft-authentication-library-for-js/issues/324