在 angularjs 身份验证中处理 JWT

Posted 2023-03-08

【中文标题】在 angularjs 身份验证中处理 JWT

【英文标题】：Handling JWT in angularjs Authentication

【发布时间】：2014-07-24 03:44:11

【问题描述】：

我们有一个 Angular 应用程序和另一个 .Net 应用程序。登录由 .Net 应用程序管理，当用户登录时，它会重定向到 Angular app.with authentication token (JWT) to the header。让我们说 url example.com/

我需要从 Header 中捕获 JWT 并将其传递给 API 以验证 JWT 并在 JWT 有效时对用户进行身份验证。

当页面被点击时，如何从标头中捕获 JWT 令牌？

【参考方案1】：

请前往：

https://auth0.com/blog/2014/01/07/angularjs-authentication-with-cookies-vs-token/

在此博客中，Alberto 描述了如何使用 $httpProvider.interceptors 在 Angular 中管理 JWT 令牌

【参考方案2】：

您应该尝试的另一件事是新的angular-jwt 项目。让我知道这是否有帮助！

声明：我根据上面的博文构建了 angular-jwt 项目。

谢谢！

【讨论】：

这个可以免费使用吗？因为在 angular-jwt 项目中，我看到了一个指向 auth0.com 的链接，其中提到了定价

注意：此时 àngular-jwt 不包含 JWT 签名验证。您应该在解码之前自行验证令牌并使用github.com/kjur/jsrsasign 信任任何数据。如果他们计划支持签名验证，请向angular-jwt 创建一个问题 - github.com/auth0/angular-jwt/issues/75

【参考方案3】：

我最近也必须在 Angular 中设置 JWT 身份验证，这是我的身份验证服务，它发布到服务器端 api 并使用本地存储来保存令牌。

有关更多信息，我写了this post，其中包括一个带有假后端的工作演示。

(function () 
    'use strict';
 
    angular
        .module('app')
        .factory('AuthenticationService', Service);
 
    function Service($http, $localStorage) 
        var service = ;
 
        service.Login = Login;
        service.Logout = Logout;
 
        return service;
 
        function Login(username, password, callback) 
            $http.post('/api/authenticate',  username: username, password: password )
                .success(function (response) 
                    // login successful if there's a token in the response
                    if (response.token) 
                        // store username and token in local storage to keep user logged in between page refreshes
                        $localStorage.currentUser =  username: username, token: response.token ;
 
                        // add jwt token to auth header for all requests made by the $http service
                        $http.defaults.headers.common.Authorization = 'Bearer ' + response.token;
 
                        // execute callback with true to indicate successful login
                        callback(true);
                     else 
                        // execute callback with false to indicate failed login
                        callback(false);
                    
                );
        
 
        function Logout() 
            // remove user from local storage and clear http auth header
            delete $localStorage.currentUser;
            $http.defaults.headers.common.Authorization = '';
        
    
)();