javascript - 针对 Laravel 后端的 Angular Auth

Question

我正在使用 Laravel 创建一个应用程序并构建一个小型内部 API 以连接到 Angular 前端。

我有授权工作，但想确保这是一种可接受的用户登录方式，并确保一切都是安全的。

session 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::get('auth/status', 'SessionsController@index');

Angular 工厂:

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;

}

]);

然后我基本上将整个应用程序包装在类似“appController”的东西中，并将“Auth”工厂声明为依赖项。然后我可以调用 Auth.getAuthStatus() 并根据用户状态隐藏/显示内容，因为这实际上是 SPA。

我意识到我还需要隐藏/auth/status URI 不被任何人查看/点击，并且想知道如何做到这一点。一种普遍的问题，但任何见解将不胜感激。谢谢。

Answer 1

好问题。我以前回答过同样的问题，所以我会说同样的话。

SPA 中的身份验证有点不同，因为您几乎完全分离了 Laravel 应用程序和 Angular。 Laravel 负责验证、逻辑、数据等。

我强烈建议您阅读底部链接的文章。

您可以使用 Laravel 的路由过滤器来保护您的路由免受未授权用户的攻击。但是，由于您的 Laravel 应用程序现在仅成为端点，前端框架将承担身份验证和授权方面的繁重工作。

一旦设置了路由过滤器，就不会阻止授权用户尝试执行他们无权执行的操作。

我上面的意思是例如:

您有一个 API 端点:/api/v1/users/159/edit

端点是 RESTful 7 之一，可用于编辑用户。任何软件工程师或开发人员都知道这是一个 RESTful 端点，如果您的应用程序授权，则可以向该端点发送包含数据的请求。

您只希望用户 159 能够执行此操作，或者管理员。

对此的解决方案是 Angular 色/组/权限，无论您如何调用它们。在 Angular 应用程序中设置用户对您的应用程序的权限，并可能将该数据存储在颁发的 token 中。

阅读这篇很棒的文章(在 AngularJS 中)，了解如何使用前端 JavaScript 框架正确地进行身份验证/授权。

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