使用 ADAL Cordova 外掛實現 Azure Active Directory B2C

請參考此處的示例: https//github.com/NewtonJoshua/Azure-ADB2C-Angularjs-sample

Azure AD B2C

Azure AD B2C 是適用於你的 Web 和移動應用程式的雲身份管理解決方案。它是一種高度可用的全球服務,可擴充套件到數億個身份。

移動應用程式 - ADAL 外掛

移動應用程式實現使用 ADAL Cordova Plugin Patch For B2C 。這是適用於 Apache Cordova 應用程式的 Active Directory 身份驗證庫(ADAL)外掛的切割版本, cordova-plugin-ms-adal 可與 Azure AD B2C 配合使用。原始的 cordova-plugin-ms-adal 外掛利用 Active Directory 為你的 Apache Cordova 應用程式提供易於使用的身份驗證功能。

找到下面的 angularjs / ionicframework 示例

安裝依賴項:

cordova plugin add https://github.com/jospete/azure-activedirectory-library-for-cordova --save

bower install angular-jwt --save

我們有一個 LoginController

.controller('LoginController', function($scope, $state, $ionicPopup, jwtHelper, AdalService) {

    $scope.login = function(){
        AdalService.login().then(function(authResponse) {
        displayUserDetails(getUserData(authResponse));
    });

    $scope.logout = AdalService.logout;

    // Decode decode the token and diaplay the user details
    function getUserData(response) {
        var user = {};
        user.token = response.access_token || response.token;
        var data = jwtHelper.decodeToken(user.token);
        user.expires_in = new Date(response.expires * 1000) || response.expiresOn;
        user.name = data.name;
        user.email = data.emails ? data.emails[0] : '';
        user.id = data.oid;
        return user;
    };

    function displayUserDetails(user) {
        $scope.user = user;
        $ionicPopup.alert({
            title: user.name,
            template: '<b>Email:</b> ' + user.email + '<br> <b>Id:</b> <code>' + user.id + '</code>'
        });
    }

});

在此處輸入 Azure AD B2C 設定

.value('settings', {
    // ADAL-B2C configuration
    adalB2C: {
        tenantName: 'Enter your tenant name',
        clientId: 'Enter your client id',
        policy: 'Enter your policy name'
    }
});

這是使用 ADAL 外掛實現 Azure AD B2C 的 adal.service

angular .module(‘azureADB2C’)。service(‘AdalService’,function($ q,$ http,settings){

    var extraQueryParams = 'nux=1';
    var userId = null;
    var redirectUri = 'https://login.microsoftonline.com/tfp/oauth2/nativeclient';
    var authority = 'https://login.microsoftonline.com/' + settings.adalB2C.tenantName;
    var resourceUri = 'https://graph.windows.net';

    this.login = function() {
        var deferredLoginResponse = $q.defer();
        var authContext = new Microsoft.ADAL.AuthenticationContext(authority);
        // Attempt to authorize user silently
        authContext.acquireTokenSilentAsync(resourceUri, settings.adalB2C.clientId, userId, redirectUri, settings.adalB2C.policy)
            .then(function(authResponse) {
                deferredLoginResponse.resolve(authResponse);
            }, function() {
                // We require user credentials so triggers authentication dialog
                authContext.acquireTokenAsync(resourceUri, settings.adalB2C.clientId, redirectUri, userId, extraQueryParams, settings.adalB2C.policy)
                    .then(function(authResponse) {
                        deferredLoginResponse.resolve(authResponse);
                    }, function(err) {
                        deferredLoginResponse.reject(err);
                    });
            });
        return deferredLoginResponse.promise;
    };

    this.logout = function() {
        // Step1: clear cache
        var authContext = new Microsoft.ADAL.AuthenticationContext(authority);
        authContext.tokenCache.clear();

        // Step2: make XmlHttpRequest pointing to the sign out url
        return $http.post(authority + '/oauth2/logout?post_logout_redirect_uri=' + redirectUri);
    };

});