Can we add javascript inside custom policies and can we use button click function to redirect to another page?
I have referred the following links when implementing custom policies.
JavaScript is now supported for custom policies. Here is the official documentation:
https://learn.microsoft.com/en-us/azure/active-directory-b2c/javascript-samples
NB: it seems you need to use the b2clogin.com domain (not login.microsoftonline.com). I cannot find this documented at the moment, but a quick test shows that JavaScript is stripped out on login.microsoftonline.com. Here is the documentation for using b2clogin.com: https://learn.microsoft.com/en-us/azure/active-directory-b2c/b2clogin.
JavaScript is currently not supported in custom UI. See the note under Create your HTML5 content.
Custom JavaScript is not currently supported in Azure AD B2C. We are working to enable that feature - please vote for the feature here so that you can get an update when the preview is available.
Yes, you can use JavaScript in custom policies. See this sample: active-directory-b2c-advanced-policies.
PlayerProfileUpdate.html
<script src="https://wingtipb2ctmpls.blob.core.windows.net/wingtiptoys/js/analytics.js" />
<script src="https://wingtipb2ctmpls.blob.core.windows.net/wingtiptoys/js/selfasserted-playerprofileupdate.js"></script>
I don't know for sure about the button click redirect. On the surface, if you can use JavaScript then you should be able to do this.
Related
Is there anyway to change the styling of the social IDP buttons when using custom policies in Azure AD B2C? For reference here's what they look like when implemented via custom policy:
And here is an example when using the user flows:
Ideally I'd like my screenshot from the first image to look a bit more like the example in the second image. I understand how to change the text on the button but I'm more referring to the color and the icon. Have scoured the documentation but bit of a custom policy noob and can't find anything that covers this.
After a little tinkering I figured out the solution:
The styling of these IDP buttons is related to their 'TargetClaimsExchangeId' in the custom policy orchestration step. While this id can be set to anything you like, setting it to the relevant Id eg: "MicrosoftAccountExchange" or "GoogleExchange" will invoke the correct styling. This isn't really made clear anywhere on the documentation.
It's possible to customize styles of each element while using azure AD B2C custom policies.
It's explained nicely here on how to use custom html files and override styles in the Microsoft docs. Please read through the whole thing.
Refer to this GitHub repository with HTML files that you can deploy to your storage account or similar and you can start working.
If you are familiar with HTML and CSS, this should be a straightforward styling changes and using custom icons etc based on your requirement.
I have been looking to the firebase-admin SDK documentation and the discussions groups and can not find any tips to generate a signInWithEmailLink with my domain server-side.
Is it possible to custom the signIn link in server-side with my domain? Or is it just possible in client app?
Update the Callback URL with your identity provider to use your custom domain instead of the default domain. For example, change https://myproject.firebaseapp.com/__/auth/handler to https://auth.mycustomdomain.com/__/auth/handler.
This is my actual work around but I would prefer a cleanest solution.
let link = await getAuth().generateSignInWithEmailLink(email, actionCodeSettings);
if(link.startsWith("https://myproject.firebaseapp.com")) {
link = link.replace("https://myproject.firebaseapp.com", process.env.AUTH_URL);
}
Go to the templates page, click edit and then click "customize domain".
The advance of doing so is that it not only affects Firebase admin.
I'm new into azure and I'm trying to setup b2c with custom html that contains some additional labels and css.
Here is simple example of my template
<!DOCTYPE html/>
<html>
<body>
<h1>It worked!</h1>
<div id="api"></div>
</body>
</html>
I uploaded this template into blob storage:
https://mydomain.blob.../b2c-pages/signin-ui.html
In azure b2c I'm using "Sign up and sign in" policy, enabled custom page content and this part is working, on login screen I see my custom page. Now I'm also requested to add support for multiple languages so I've enabled language customization and everything is working out of the box except text into h1 tag.
I'm wondering how to provide azure b2c translation for this string? Can I specify new UXElement in my template?
After some research I've founded this link https://learn.microsoft.com/en-us/azure/active-directory-b2c/custom-policy-localization but as I can see, here there is using custom policy.
Can I fulfill my request without custom policy setup?
Edit1:
Thanks to comment form Chauncy (https://learn.microsoft.com/en-us/azure/active-directory-b2c/user-flow-language-customization) I was able to figure out that I can use wildcard value {Culture:RFC5646} in url for custom UI.
So I setup Custom page URI like:
https://mydomain.blob.../b2c-pages/signin-ui_{Culture:RFC5646}.html
and I uploaded files like
https://mydomain.blob.../b2c-pages/signin-ui_en.html
https://mydomain.blob.../b2c-pages/signin-ui_fr.html
My question is, dose this approach is correct or I misunderstand the docks?
I tried to test your method and you are right.We can customize the language in this way.
Here's how I tested it.Thank you for discovering this method.
The important thing is that the parameters must be passed in here.
ADB2C now allow us to use javascript within built-in policies.
But this is still a preview feature (since several months). Is it safe to use it or not ? We clearly need now to move on the new b2clogin.com domain and we would have taken the opportunity to also implement javascript.
Pubic previews are not suggested for production environment because, the behavior will change during preview and we can't confirm the GA date.
I am working on a project where i have to use a signup/sign-in policy to create a custom html page which is working fine. Now the requirement is We need to fill the form dropdown field with some dynamic data from our database.
Since we can't use iframes or javascript with azure b2c..is there a way to manipulate input tag thats rendered in
<div id="api"></div>
if not is there any other strategy to populate dynamic data into these custom attributes without typing them in manually into azure policy? perhaps any powershell command? or Azure API such as graph api?
maybe this links helps you:
https://learn.microsoft.com/en-us/azure/active-directory-b2c/active-directory-b2c-reference-customize-ui-custom
The important part is the third note:
For security reasons, the use of JavaScript is currently blocked for customization. To unblock JavaScript, use of a custom domain name for your Azure AD B2C tenant is needed.
BR