使用spa中的azure b2c对webapi进行身份验证(angular和adal.js)

Question

我正在尝试验证我的SPA(angular.js和adal.js(类似于 https://github.com/Azure-Samples/active-directory-angularjs-singlepageapp-dotnet-webapi示例)

我的广告是一个天蓝色的b2c预览租户.

我可以从我的网站成功登录我的webapi,但不能通过角度从JS SPA登录.

我的设置:Webapi和网站共享相同的clientid(似乎只是这样工作)SPA有自己的clientid,因为否则我在尝试登录时得到"api版本不支持"错误.我为所有应用程序启用了oauth2AllowImplicitFlow ,授予从spa到webapi的应用程序权限.Coap在Webapi和SPA上启用.

我甚至似乎能够在完成登录后获得令牌,但是当我尝试呼叫我的api时,我得到了拒绝此请求的访问权限.

这应该是这样的吗？我找不到如何将b2c与spa一起使用以及在不同服务器上运行的api的示例.

提前致谢

彼得

Answer 1

官方说它不受微软的支持,但是对github azure-activedirectory-library-for-js的实验分支进行了一些修改,你可以让它运行起来.

使用adal.js的logOut方法中第546行的策略参数,将logout url修复为oauth2协议的v2.0端点:

var urlNavigate = this.instance + tenant + '/oauth2/v2.0/logout?' + logout + (this.config.extraQueryParameter ? '&' + this.config.extraQueryParameter : '');

在adal.js的方法_createUser中永远不会设置username属性.用户名用于续订令牌过程,通过添加以下三行来修复它:

if (parsedJson.hasOwnProperty('emails')) {
    user.userName = parsedJson.emails[0];
}

最后,在第146行的adal-angular.js中,使用错误的类型参数调用acquireTokenSilent.此方法仅接受数组类型作为scopes参数,通过将clientId放在数组中来修复它:

_adal.acquireTokenSilent([_adal.config.clientId], null, function (error, tokenOut) {

我已经在github上提出了关于此的请求,您可以将其用作参考.

当您在角度初始化adal提供程序时,将您的b2c登录策略放在extraQueryParameter中,如下所示:

adalProvider.init({
    tenant: 'tenant.onmicrosoft.com',
    clientId: 'clientid',
    extraQueryParameter: "p=B2C_1_SignIn"
}, $httpProvider);

Answer 2

目前不支持此功能。

单页应用程序 (Javascript)

许多现代应用程序都有一个主要用 Javascript 编写的单页应用程序 (SPA) 前端，通常使用 AngularJS、Ember.js、Durandal 等 SPA 框架。此流程在 Azure AD B2C 预览版中尚不可用。