meanjs framework client side user authentication

Question

I am learning MEAN stack with MEANJS framework.

I would like to see some examples of how to configure the routes on the client side:

1) How to disallow unlogged users to access specific route?

2) How to redirect users to login page, and once authenticated return them to the specific route?

3) Do I have to install any extra module, or it could be done with default meanjs dist?

This is an example of a meanjs module route:

'use strict';

//Setting up route
angular.module('cart').config(['$stateProvider',
    function($stateProvider) {
        // Cart state routing
        $stateProvider.
        state('cart', {
            url: '/cart',
            templateUrl: 'modules/cart/views/cart.client.view.html'
        });
    }
]);

I have seen that when a user is authenticated I have an authentication object available in the $scope as follows:

{
  "user": {
    "_id": "54cf7e730d7da864c0d511f5",
    "displayName": "Korner Foxiertw",
    "provider": "local",
    "username": "fox23",
    "__v": 0,
    "updated": "2015-02-04T19:55:38.435Z",
    "created": "2015-02-02T13:41:07.791Z",
    "roles": [
      "user"
    ],
    "email": "[email protected]",
    "lastName": "Korner",
    "firstName": "Foxiertw"
  }
}

How to deal with this info?

I have seen examples of the above, but not specifically for meanjs framework. For example, this one:

http://www.seanmarchetti.com/authentication_with_angularui_router.html

These are the libs I have in my client-side app:

"dependencies": {
    "bootstrap": "~3",
    "angular": "~1.3",
    "angular-resource": "~1.2",
    "angular-mocks": "~1.2",
    "angular-cookies": "~1.2",
    "angular-animate": "~1.3",
    "angular-touch": "~1.2",
    "angular-sanitize": "~1.2",
    "angular-bootstrap": "~0.11.2",
    "angular-ui-utils": "~0.1.1",
    "angular-ui-router": "~0.2.11",
    "font-awesome": "latest"
}

Kind Regards.

Fabian Buentello · Accepted Answer · 2015-03-14 01:42:52Z

3

MEAN.JS automatically injects the Authentication dependency into your controller, you should see the following code.

$scope.authentication = Authentication;

just add this afterwards, or redirect to whatever path you want it to.

if (!$scope.authentication.user) $location.path('/');

answered Mar 14, 2015 at 1:42

Fabian Buentello

5321 gold badge4 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

aikorei Over a year ago

Agreed. You can see an example of this in /public/modules/users/controllers/settings.client.controller.js. If you want to use elsewhere, simply inject the Authentication dependency in whatever controller you're using, e.g.

angular.module('thing').controller('MyController', ['$scope', 'Authentication', function($scope, Authentication) { $scope.user = Authentication.user; }]);

Saravanan S · Accepted Answer · 2015-03-12 09:23:17Z

0

Since it was little complicated to use MEAN JS framework for me, I have built my own mean stack with SEO support for Single Page applications. Please take a look if it is useful for you. Handled the authentication for each route like your scenario

https://github.com/saravmajestic/express-angular-seo-zombie-seed

answered Mar 12, 2015 at 9:23

Saravanan S

1,0431 gold badge11 silver badges24 bronze badges

Comments

Charlie Tupman · Accepted Answer · 2015-04-22 15:38:14Z

I was looking at a similar problem, I wanted to open certain routes only to authenticated users and stop others having access to them.

I created a new controller called AuthenticateController:

    angular.module('projects').controller('AuthenticateController', ['$scope', '$stateParams', '$location', 'Authentication', 'Projects',
function($scope, $stateParams, $location, Authentication, Projects) {
    $scope.authentication = Authentication;
    if ($scope.authentication.user === '') {
        $location.path('home/');
    }
}

And added it into the controller.js file for that module.

This has some (Very) basic code that checks to see if the user is authenticated and if not chucks them back to the home page. I then bound the route to this controller in the routes.js:

        state('createProject', {
        url: '/projects/create',
        templateUrl: 'modules/projects/views/create-project.client.view.html',
        controller: 'AuthenticateController'
    }).

This solution seems to work however I am new to MEAN (my first week) so if anyone has a better solution or could elaborate then suggestions not only welcome but encouraged.

Collectives™ on Stack Overflow

meanjs framework client side user authentication

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related