Azure AD B2C customization template errors

6
votes

I deleted my storage account which held the folder containing the B2C sign-in/sign-up policy custom UI files. Realizing my mistake, I created a new storage account and uploaded the policy files. I updated the paths in the policy configuration. Now, when clicking login, instead of the Microsoft form I get:

An unhandled exception occurred while processing the request.

InvalidOperationException: Invalid non-ASCII or control character in header: 0x000D
Microsoft.AspNetCore.Server.Kestrel.Internal.Http.FrameHeaders.ThrowInvalidHeaderCharacter(char ch)

I set a breakpoint in OpenIdConnectOptionsSetup_OnRemoteFailure where the context exception reveals:

Message contains error: 'server_error', error_description:
'AADB2C90047: The resource 'https://{StorageAccount}.blob.core.windows.net/loginui/customlogin.html' contains script errors preventing it from being loaded.
Correlation ID: fc9f9ac5-14bc-4af4-992c-a2cf0050316d
Timestamp: 2017-10-24 15:10:00Z', error_uri: 'error_uri is null'.

However, this error doesnt make much sense when the template looks like this:

<!DOCTYPE html>
<html>
   <head>
       <title>!Add your title here!</title>
   </head>
   <body>
       <div id="api"></div>
   </body>
</html>

I'm new to Azure, so I'm sure I'm missing something obvious. I just need the templates to work again.

2
azureuser-interfacecustomizationazure-ad-b2c
Did you enable CORS on the storage account? – Chris Padgett
Thank you very much that was it. – srm
@srm can you please upvote Chris' answer and flag the question as answered? – Saca
@srm Can you please flag this question as answered? – Chris Padgett

2 Answers

14
votes

(Adding answer for completeness.)

Azure AD B2C loads the page UI customization files to the end-user's browser using Cross-Origin Resource Sharing (CORS).

If the customization files are deployed to a storage account, then this requires you to allow CORS on the storage account, as documented here.

You can test then whether CORS has been allowed as required as documented here.

0
votes

I had the same problem. The solution is to PUT "*" in the settings of your web app. This is because after your login page call you going first to "b2clogin.com" and then return automaticly back to your web app with specific settings. But if your "CORS" setting not set, the redirection from "b2clogin.com" to your app will be restricted.

I hope it helps you.