javascript - 如何在身份验证后从静态快速页面提供整个 angularJS SPA？

Question

因此，我为我工作的公司构建了一个 SPA，由于它显示的数据非常敏感，所以在我合并身份验证之前它不能上线。出于这个原因，我试图为登录构建一个静态快速页面，而不是在 SPA 中处理它。

目前我是这样做的:

1. 提供我的登录页面。
2. 调用用于身份验证的 API 路由。
3. 如果成功提供 SPA。
4. 如果不成功，显示适当的错误消息并重新呈现登录页面。

我之前用 JWTs 构建了一个身份验证方案，所以我不担心那部分。现在我只想通过单击一个按钮来为我的 SPA 服务。如果我删除下面的路由并转到主页，我的应用程序将正常加载。我的问题是我正在尝试路由到 Angular 应用程序的主页('/#/')并快速呈现登录页面。

我主页上的按钮发出获取登录请求。我希望它重定向到我已经构建的 SPA。看起来应该很简单，但我无法弄清楚如何在我的生活中做到这一点。

//Login routes, success delivers angular SPA
app.get('/', function (req, res) {
  res.render('index.jade', {
    title : "n562d", 
    strapline : "Please Log In"
  })
});

app.get('/login', function (req, res) {
  res.redirect('/#/')
});

Answer 1

我觉得你有点糊涂了。在路由方面使用 express 作为 REST 引擎。 Angular routes 将负责客户端的显示逻辑和 View 路由。

我建议您将 JSON 数据传递给 Angular 前端，让它为您完成这项工作。例如:

app.get('/', function (req, res) {
  res.json({
    title : "n562d", 
    strapline : "Please Log In"
  })
});

您可以在端点访问 API:http://localhost:3000/使用 $resource访问快速端点的服务:

例子:

var MyResource = $resource('/');
 var myResource = new MyResource();
 myResource.$get(function(result){
   //result holds -->{title : "n562d", strapline : "Please Log In"}
   //use $location to change the uri, which is handled by Angular route config
   $location.path('/') 
 });

对于 Angular 路由，我建议您使用 ui-router

例子:

function($stateProvider,$urlRouterProvider){
    $urlRouterProvider.otherwise("/");

     $stateProvider
     .state('index', {
      url: "/",
      templateUrl: 'app/authorization/index.tpl.html',
      controller: 'AuthController'
    })
     .state('login', {
      url: "/login/",
      templateUrl: 'app/authorization/login.tpl.html',
      controller: 'AuthController'
    })
    .state('signup',{
      url: "/signup/",
      templateUrl : 'app/authorization/signup.tpl.html',
      controller: 'AuthController'
    });
}
]);

请注意:我只是将我的 Controller 命名为 AuthController，您可以将其替换为您的 Controller 名称，与 View 相同。

如果您需要更详细的答案，请告诉我，我会更新它。希望对您有所帮助。