允許訪問AngularJS應用程序的傳統登錄頁面

我開始了一個簡單的Web應用程序，其中API爲Python Flask，前端爲AngularJS，全部由Nginx提供服務。該API位於http://site/api/，顯然所有端點都得到了適當的保護。允許訪問AngularJS應用程序的傳統登錄頁面

我探索我的關於身份驗證選項，我偶然發現了this page，其中作者指出在他的介紹如下：

一種選擇我嘗試了是有一個傳統的登錄頁面其中，如果成功，則重定向到加載實際應用程序的安全URL。這還有一個額外的好處，即用於登錄用戶頁面的客戶端代碼和視圖模板對於任何未登錄的用戶都是不可訪問的。 [...]我想要一個無縫的用戶體驗，除了初始化以外沒有完整的頁面重新加載頁面加載，所以我決定稍微玩一下，看看我是否可以提出一個替代方案。

筆者隨後進行詳細敘述替代，同時我會通過實施原液（傳統登錄其重定向到一個安全的網址頁）有興趣。我嘗試了幾種方法，例如成功驗證後使用Nginx X-Accel-Redirect，但未能達到完全滿意的解決方案。

所以有這樣的問題：我怎麼能實現一個傳統的登錄頁面，成功後，重定向到一個安全的URL包含我的AngularJS應用程序？目前，我的登錄端點位於http://site/api/login，靜態數據（包括Angular應用程序）由nginx提供。

來源

2014-02-26 icecrime

的代碼看起來像 HTML：

<div class="col-sm-9"> 
    <div class="container login"> 
     <h1>User Login</h1> 
     <p>Please login below, if you have forgotten your password please <a href="/index.html#/resetpassword"><b>Click Here</b></a> to reset it.</p> 
     <form> 
      <div class="row"> 
       <div class="col-sm-6 form-group"> 
        <label for="email">Email Address</label> 
        <input class="form-control input-lg" type="email" id="inputEmail" required ng-model="user.email" placeholder="Enter your email"> 
       </div> 
       <div class="col-sm-6 form-group"> 
        <label for="password">Password</label> 
        <input class="form-control input-lg" type="password" required ng-model="user.password" placeholder="Enter your password"> 
       </div> 
      </div> 
      <div ng-show="IsLoginFailure"> 
       <p><span class="error"><b>Error:</b>Your emailId or password is wrong </span></p> 
      </div> 
      <br /> 
      <button class="btn btn-grove-one btn-lg btn-bold" type="submit" ng-click="login()">Login</button> 
     </form> 
     <br /> 
     <div class="clearfix"></div> 
    </div> 
</div>

.controller('LoginCtrl', ['$scope', '$http', '$rootScope', '$location', '$route', function ($scope, $http, $rootScope, $location, $route) { 


$scope.login = function() { 
      $http({ 
       method: 'POST', 
       url: 'http://site/api/login', 
       data: $scope.user 
      }).success(function (response) { 
        $location.path(Your Path); 
        $route.reload(); 
       }); 

      }).error(function() { 
       $scope.IsLoginFailure = true; 
      }) 
     } 
    }])

來源

2014-02-26 07:57:55

謝謝，但這聽起來不像一個安全的URL給我：任何人都可以直接轉到AngularJS應用程序的url（'YourPath'在你的代碼中）並檢索html和js而無需登錄。 – icecrime

我可以看到兩個可能的解決方案：

1）瓶（登錄頁面和靜態文件即成一切應用程序）在一個單獨的藍圖。使用類似Flask-Login的東西進行身份驗證。

2）如果想要更好的性能，可以用use Lua scripting in Nginx來實現對靜態資源的認證。您需要在登錄頁面中設置一個可以在Lua中閱讀的cookie。如果第一個解決方案導致性能問題，我只會這樣做。

來源

2014-02-26 22:13:53 catwell

允許訪問AngularJS應用程序的傳統登錄頁面

回答

相關問題