Issue
Hello,
This is just a request for information regarding the documentation.
This issue is for the sample
- [ ] 1-1) Sign-in with Azure AD
- [x] 1-2) Sign-in with Azure AD B2C
- [ ] 2-1) Acquire a Token and call Microsoft Graph
- [ ] 3-1) Protect and call a web API on Azure AD
- [ ] 3-2) Protect and call a web API on Azure AD B2C
- [ ] 4) Deploy to Azure Storage and App Service
- [ ] 5-1) Call a web API using App Roles
- [ ] 5-2) Call a web API using Security Groups
- [ ] 6-1) Call Microsoft Graph using on-behalf-of flow
- [ ] 6-2) Call a multi-tenant web API
This issue is for a
- [ ] bug report -> please search issues before submitting
- [ ] question
- [ ] feature request
- [x] documentation issue or request
Minimal steps to reproduce
I have been trying to make the project working this afternoon, by following this documentation:
https://learn.microsoft.com/en-us/azure/active-directory-b2c/configure-authentication-sample-angular-spa-app
However, the documentation does not seem to be in sync with the repository anymore. I have tried to follow the configuration specified, but instead of this from the documentation:
export const b2cPolicies = {
names: {
signUpSignIn: "b2c_1_susi_reset_v2",
editProfile: "b2c_1_edit_profile_v2"
},
authorities: {
signUpSignIn: {
authority: "https://your-tenant-name.b2clogin.com/your-tenant-name.onmicrosoft.com/b2c_1_susi_reset_v2",
},
editProfile: {
authority: "https://your-tenant-name.b2clogin.com/your-tenant-name.onmicrosoft.com/b2c_1_edit_profile_v2"
}
},
authorityDomain: "your-tenant-name.b2clogin.com"
};
export const msalConfig: Configuration = {
auth: {
clientId: '<your-MyApp-application-ID>',
authority: b2cPolicies.authorities.signUpSignIn.authority,
knownAuthorities: [b2cPolicies.authorityDomain],
redirectUri: '/',
},
// More configuration here
}
export const protectedResources = {
todoListApi: {
endpoint: "http://localhost:5000/api/todolist",
scopes: ["https://your-tenant-namee.onmicrosoft.com/api/tasks.read"],
},
}
I found this code, without the protectedResources part:
/**
* This file contains authentication parameters. Contents of this file
* is roughly the same across other MSAL.js libraries. These parameters
* are used to initialize Angular and MSAL Angular configurations in
* in app.module.ts file.
*/
import { LogLevel, Configuration, BrowserCacheLocation } from '@azure/msal-browser';
const isIE = window.navigator.userAgent.indexOf("MSIE ") > -1 || window.navigator.userAgent.indexOf("Trident/") > -1;
/**
* Enter here the user flows and custom policies for your B2C application,
* To learn more about user flows, visit https://docs.microsoft.com/en-us/azure/active-directory-b2c/user-flow-overview
* To learn more about custom policies, visit https://docs.microsoft.com/en-us/azure/active-directory-b2c/custom-policy-overview
*/
export const b2cPolicies = {
names: {
signUpSignIn: 'B2C_1_susi_v2',
resetPassword: 'B2C_1_reset_v3',
editProfile: 'B2C_1_edit_profile_v2',
},
authorities: {
signUpSignIn: {
authority: 'https://fabrikamb2c.b2clogin.com/fabrikamb2c.onmicrosoft.com/b2c_1_susi_v2',
},
resetPassword: {
authority: 'https://fabrikamb2c.b2clogin.com/fabrikamb2c.onmicrosoft.com/B2C_1_reset_v3',
},
editProfile: {
authority: 'https://fabrikamb2c.b2clogin.com/fabrikamb2c.onmicrosoft.com/b2c_1_edit_profile_v2',
},
},
authorityDomain: 'fabrikamb2c.b2clogin.com',
};
/**
* Configuration object to be passed to MSAL instance on creation.
* For a full list of MSAL.js configuration parameters, visit:
* https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-browser/docs/configuration.md
*/
export const msalConfig: Configuration = {
auth: {
clientId: '9067c884-9fa6-414f-9aa4-a565b1cb46be', // This is the ONLY mandatory field that you need to supply.
authority: b2cPolicies.authorities.signUpSignIn.authority, // Defaults to "https://login.microsoftonline.com/common"
knownAuthorities: [b2cPolicies.authorityDomain], // Mark your B2C tenant's domain as trusted.
redirectUri: '/auth', // Points to window.location.origin by default. You must register this URI on Azure portal/App Registration.
postLogoutRedirectUri: '/', // Points to window.location.origin by default.
},
cache: {
cacheLocation: BrowserCacheLocation.LocalStorage, // Configures cache location. "sessionStorage" is more secure, but "localStorage" gives you SSO between tabs.
storeAuthStateInCookie: isIE, // Set this to "true" if you are having issues on IE11 or Edge. Remove this line to use Angular Universal
},
system: {
/**
* Below you can configure MSAL.js logs. For more information, visit:
* https://docs.microsoft.com/azure/active-directory/develop/msal-logging-js
*/
loggerOptions: {
loggerCallback(logLevel: LogLevel, message: string) {
console.log(message);
},
logLevel: LogLevel.Verbose,
piiLoggingEnabled: false
}
}
}
/**
* Scopes you add here will be prompted for user consent during sign-in.
* By default, MSAL.js will add OIDC scopes (openid, profile) to any login request.
* For more information about OIDC scopes, visit:
* https://docs.microsoft.com/en-us/azure/active-directory/develop/v2-permissions-and-consent#openid-connect-scopes
*/
export const loginRequest = {
scopes: []
}
/**
* An optional silentRequest object can be used to achieve silent SSO
* between applications by providing a "loginHint" property (such as a username). For more, visit:
* https://learn.microsoft.com/en-us/azure/active-directory/develop/msal-js-sso#sso-between-different-apps
* If you do not receive the username claim in ID tokens, see also:
* https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-browser/FAQ.md#why-is-getaccountbyusername-returning-null-even-though-im-signed-in
*/
export const silentRequest = {
scopes: [],
loginHint: "[email protected]"
};
At least, this is what I found in the folder ms-identity-javascript-angular-tutorial-main\ms-identity-javascript-angular-tutorial-main\1-Authentication\2-sign-in-b2c\SPA\src\app
.
In Authorization-II\2-call-api-b2c\
I found an auth-config.ts
with protected resources but when running the project and clicking on "Sign In" I get an error:
core.mjs:9171 ERROR Error: Uncaught (in promise): ClientAuthError: endpoints_resolution_error: Error: could not resolve endpoints. Please check network and try again. Detail: ClientAuthError: openid_config_error: Could not retrieve endpoints. Check your authority and verify the .well-known/openid-configuration endpoint returns the required endpoints. Attempted to retrieve endpoints from: https://pickspma.onmicrosoft.com.b2clogin.com/pickspma.onmicrosoft.com/b2c_1_susi_v2/v2.0/.well-known/openid-configuration
ClientAuthError: endpoints_resolution_error: Error: could not resolve endpoints. Please check network and try again. Detail: ClientAuthError: openid_config_error: Could not retrieve endpoints. Check your authority and verify the .well-known/openid-configuration endpoint returns the required endpoints. Attempted to retrieve endpoints from: https://pickspma.onmicrosoft.com.b2clogin.com/pickspma.onmicrosoft.com/b2c_1_susi_v2/v2.0/.well-known/openid-configuration
at ClientAuthError.AuthError [as constructor] (AuthError.js:31:24)
at new ClientAuthError (ClientAuthError.js:216:28)
at ClientAuthError.createEndpointDiscoveryIncompleteError (ClientAuthError.js:253:16)
at Function.<anonymous> (AuthorityFactory.js:42:31)
at step (_tslib.js:75:23)
at Object.throw (_tslib.js:56:53)
at rejected (_tslib.js:47:47)
at _ZoneDelegate.invoke (zone.js:372:26)
at Object.onInvoke (core.mjs:26274:33)
at _ZoneDelegate.invoke (zone.js:371:52)
at resolvePromise (zone.js:1211:31)
at zone.js:1118:17
at zone.js:1134:33
at _ZoneDelegate.invoke (zone.js:372:26)
at Object.onInvoke (core.mjs:26274:33)
at _ZoneDelegate.invoke (zone.js:371:52)
at Zone.run (zone.js:134:43)
at zone.js:1275:36
at _ZoneDelegate.invokeTask (zone.js:406:31)
at Object.onInvokeTask (core.mjs:26261:33)
Can you please confirm my reasoning is correct and that the documentation and sample source code are not in sync?
Any log messages given by the failure
see in previous answer
Expected/desired behavior
Documentation matching with repository source code
Please note I didn't follow this documentation:
https://github.com/Azure-Samples/ms-identity-javascript-angular-tutorial/blob/main/1-Authentication/2-sign-in-b2c/README-incremental.md
Is it the one to follow?
Library version
N/A
Browser and version
Chrome 108.0.5359.124
Best Regards,
Nicolas