CODEWITHSUNDEEP
javascriptphpangularjsauthenticationlaravel
cpk
cpk

Reputation: 809

Angular Auth against Laravel backend

I am creating an app using Laravel and building a small internal API to connect to with an Angular frontend.

I have the auth working, but wanted to ensure that this is an acceptable way to log in a user, and to make sure everything is secure.

Sessions Controller:

public function index() {
    return Response::json(Auth::check());
}


public function create() {
    if (Auth::check()) {
        return Redirect::to('/admin');  
    }
    return Redirect::to('/');
}

public function login() {

    if (Auth::attempt(array('email' => Input::json('email'), 'password' => Input::json('password')))) {
        return Response::json(Auth::user());
        // return Redirect::to('/admin');
    } else {
        return Response::json(array('flash' => 'Invalid username or password'), 500);   
    }       
}

public function logout() {
    Auth::logout();
    return Response::json(array('flash' => 'Logged Out!'));
}

Laravel Route:

Route::get('auth/status', 'SessionsController@index');

Angular Factory:

app.factory('Auth', [ "$http", function($http){


var Auth = {};

Auth.getAuthStatus = function() {
    $http({
        method: "GET", 
        url: "/auth/status", 
        headers: {"Content-Type": "application/json"}
    }).success(function(data) {
        if(!data) {
        console.log('Unable to verify auth session');
        } else if (data) {
            console.log('successfully getting auth status');
            console.log(data);              

            // return $scope.categories;
            Auth.status = data;
            return Auth.status;
        }
    });

}

return Auth;

}

]);

I would then essentially wrap the whole app in something like an "appController" and declare the 'Auth' factory as a dependency. Then I can call Auth.getAuthStatus() and hide / show things based on the user state since this will essentially be SPA.

I realize I also need to hide the /auth/status URI from being viewed / hit by anyone, and was wondering how to do that as well. Kind of a general question but any insight would be greatly appreciated. Thanks.

Upvotes: 5

Views: 6061

Answers (1)

user4097807
user4097807

Reputation:

Great question. I've answered this same question before so I will say the same thing.

Authentication is a bit different in SPAs because you separate your Laravel app and Angular almost completely. Laravel takes care of validation, logic, data, etc.

I highly suggest you read the article linked at the bottom.

You can use Laravel's route filters to protect your routes from unauthorized users. However, since your Laravel application has now become an endpoint only, the frontend framework will be doing the heavy lifting as far as authentication and authorization.

Once you have route filters set, that doesn't prevent authorized users from attempting to do actions that they are not authorized to do.

What I mean by the above is for example:

You have an API endpoint: /api/v1/users/159/edit

The endpoint is one of the RESTful 7, and can be used to edit a user. Any software engineer or developer knows that this is a RESTful endpoint, and if authorized by your application, could send a request with data to that endpoint.

You only want the user 159 to be able to do this action, or administrators.

A solution to this is roles/groups/permissions whatever you want to call them. Set the user's permissions for your application in your Angular application and perhaps store that data in the issued token.

Read this great article (in AngularJS) on how to authenticate/authorize properly using frontend JavaScript frameworks.

Article: https://medium.com/opinionated-angularjs/techniques-for-authentication-in-angularjs-applications-7bbf0346acec

Upvotes: 9

Related Questions