Angular.js: Combine Restangular and oauth-ng

Question

We have built an RestFul API implementing OAuth 2.0

Now I want to connect an AngularJS frontend using Restangular and oauth-ng

But how can I get both to interact regarding the oauth token?

Oauth-ng should handle login/logout and token refreshing. Restangular should fetch the access_token from oauth-ng to send the token with all requests.

My current code is implemented like this.

angular
    .module('myapp', ['oauth','restangular'/* ... */ ])
    .config(function ($routeProvider,$locationProvider,RestangularProvider,AccessToken) {
        $routeProvider
            .when('/access_token=:accessToken', {
                template: '',
                controller: function ($location, AccessToken) {
                    var hash = $location.path().substr(1);
                    AccessToken.setTokenFromString(hash);
                    console.log(AccessToken); //THIS WORKS
                    $location.path('/');
                    $location.replace();
                }
            })
            .when('/', {
                templateUrl: 'views/main.html',
                controller: 'MainCtrl'
            })
            .otherwise({
                redirectTo: '/'
            });

        $locationProvider.html5Mode({
            enabled: true,
            requireBase: true
        }).hashPrefix('!');

        RestangularProvider.setBaseUrl('https://myapi.local/');
        // next line throws error
        RestangularProvider.setDefaultHeaders({Authorization: 'Bearer ' + AccessToken.get()});
    });

But this code throws an error "Unknown provider: AccessToken".

Seems like "AccessToken" is not yet available at the config stage. But I do not want to implement this general function in every controller again and again.

What would be a good way to connect both modules?

Thanks for your help!

Gabriel Kohen · Accepted Answer · 2015-05-01 11:49:27Z

The AccessToken var is not injected in the scope you're using it. Did you try moving setting the Token for Restangular to the point where you fulfill your promise. Example:

angular
.module('myapp', ['oauth','restangular'/* ... */ ])
.config(function ($routeProvider,$locationProvider,RestangularProvider) {
    $routeProvider
        .when('/access_token=:accessToken', {
            template: '',
            controller: function ($location, AccessToken) {
                var hash = $location.path().substr(1);
                AccessToken.setTokenFromString(hash);
                RestangularProvider.setDefaultHeaders({Authorization: 'Bearer ' + AccessToken.get()});
                console.log(AccessToken); //THIS WORKS
                $location.path('/');
                $location.replace();
            }
        })
        .when('/', {
            templateUrl: 'views/main.html',
            controller: 'MainCtrl'
        })
        .otherwise({
            redirectTo: '/'
        });

    $locationProvider.html5Mode({
        enabled: true,
        requireBase: true
    }).hashPrefix('!');

    RestangularProvider.setBaseUrl('https://myapi.local/');
});

Collectives™ on Stack Overflow

Angular.js: Combine Restangular and oauth-ng

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related