来自Angular应用程序和msal的Azure AD B2C：加载自定义UI Html

Question

我正在尝试使用Azure B2c登录角度应用程序。登录页面是自定义的，图像，css，ui html文件存储在azure目录中的blobstorage中。

单击登录按钮时，页面未加载，显示的控制台错误为：zone.js：682未处理的Promise拒绝：AADB2C90047：资源'https://storageblob.blob.core.windows.net/storageblobcontainer/ui.html'包含阻止加载的脚本错误。

有人可以解释一下如何解决这个问题吗？

Answer 1

我假设您已按照以下Javascript指南自定义AD B2C UI

使用JavaScript自定义应用程序界面时，请遵循以下准则：

不要在<a> HTML元素上绑定click事件。
不要依赖Azure AD B2C代码或注释。
请勿更改Azure AD B2C HTML元素的顺序或层次结构。使用Azure AD B2C策略来控制UI元素的顺序。
您可以使用以下注意事项调用任何RESTful服务：您可能需要将RESTful服务CORS设置为允许客户端HTTP调用。确保您的RESTful服务是安全的，并且仅使用HTTPS协议。不要直接使用JavaScript来调用Azure AD B2C端点。
您可以嵌入JavaScript，也可以链接到外部JavaScript文件。使用外部JavaScript文件时，请确保使用绝对URL而不是相对URL。
JavaScript框架： Azure AD B2C使用特定版本的jQuery。不要包含其他版本的jQuery。在同一页面上使用多个版本会导致问题。不支持使用RequireJS。 Azure AD B2C不支持大多数JavaScript框架。
可以通过调用window.SETTINGS，window.CONTENT对象（例如当前UI语言）来读取Azure AD B2C设置。不要更改这些对象的值。
若要自定义Azure AD B2C错误消息，请在策略中使用本地化。
如果使用策略可以实现任何目的，通常是推荐的方式。

否则可能会导致问题。我也希望你在CORS值中添加了通配符“https”。

这篇文章讲的是同一个问题。

希望能帮助到你。