I have a Power Pages sites configured with Azure B2C login for external users. It works fine when accessing the sign-in page by manually clicking the provider button on the /SignIn page.
However, we would also like to have a sign-in button directly on the front page. Having researched this topic, I learned this has to be implemented using MSAL. I get the link - but after a successful login I get back to a "page not found" error in the Power Pages site.
I generate the link as following in TypeScript using @azure/msal-node@2.7.0 and @azure/msal-browser@3.13.0
The code looks like this:
import { PublicClientApplication, AuthenticationResult } from "@azure/msal-browser";
const msalConfig = {
auth: {
clientId: "3d93b935-4bd2-4db1-b06c-911ea505ab36",
authority: "https://[tenant].b2clogin.com/[tenant].onmicrosoft.com/B2C_1_[Policy]",
redirectUri: "https://[sitename].powerappsportals.com/signin-aad-b2c_1",
knownAuthorities: ["[tenant].b2clogin.com"]
}
};
const msalInstance = new PublicClientApplication(msalConfig);
async function login() {
try {
await msalInstance.initialize();
await msalInstance.handleRedirectPromise();
const loginRequest = {
scopes: ["openid"]
};
await msalInstance.loginRedirect(loginRequest);
} catch (error) {
console.error(error);
}
}
Replace [tenant], [policy] and [sitename] with values from your own setup.
In the Html we then call the login method when the Sign-In button is clicked:
<button onclick="javascript:login()">Sign-In</button>
Again, the link gets me to the sign-in page where I can successfully sign-in with MFA and all.
But when redirected back to the Power Pages site, it fails with a "Page not found" error.
Trying to navigate to the front page and I am still not signed in.
Any ideas how to configure MSAL with the correct parameters?
I have tested various suggestions from articles and ChatGPT.
But none seems to work with Power Pages so far.
