将登录验证模块与现有的Angular JS应用程序集成

Integrating login Authentication module with existing Angular JS application

本文关键字:Angular JS 应用程序 集成 登录 验证 模块      更新时间:2023-10-09

我购买了一个Angular JS主题,并开始开发我们的应用程序。该应用程序的$routeProvider如下所示:

    $routeProvider
    .when('/', {
        redirectTo: '/dashboard'
    })
    .when('/:page', {
        templateUrl: function($routeParams) {
            return 'views/'+ $routeParams.page +'.html';
        },
        controller: 'PageViewController'
    })
    .when('/:page/:child*', {
        templateUrl: function($routeParams) {
            return 'views/'+ $routeParams.page + '/' + $routeParams.child + '.html';
        },
        controller: 'PageViewController'
    })
    .otherwise({
        redirectTo: '/dashboard'
    });

这是一个单页应用

现在我需要将登录验证模块集成到其中。我对AngularJS还比较陌生。我搜索了很多关于AngularJS应用程序的登录、身份验证模块的文章(在stack overflow中也很少有好的答案),我可以理解它是如何工作的。

但我不知道如何使登录与现有的应用程序协同工作。要么拥有两个不同的应用程序(一个用于登录验证,一个用于主应用程序),要么将登录作为单独的angular.module集成在主应用程序中。请指导我该怎么做…

所有示例在$routeProvider中只有2或3个项目,包括loginlogout以及主应用程序页面。但在这种情况下,主应用程序页面本身有许多路由提供商。

我想我有一些基本的脱节。请帮助我理解断开连接并将登录身份验证与现有应用程序集成。

我不知道还要添加哪些代码组件。如果需要,将共享其他代码。

谢谢。

如果您正在寻找一个完整的解决方案,我认为这可能是一个很长的答案。我可以很快说的是,在我看来,你必须:

  1. 创建一个登录页面并将其放在视图文件夹中
  2. 创建特定的登录控制器
  3. 在使用刚才创建的登录控制器的":/page"路由之前,添加一个到登录页的路由
  4. 如果您的应用程序需要身份验证,则必须编辑PageViewController,以便在当前用户尚未登录的情况下重定向到登录页面

正如我所说,这是一个快速的答案,以应对你必须做的重大工作,但我希望你觉得这很有用。

再见