关键词：
【中文标题】使用 JWT 处理 401（未授权）angularjs 身份验证【英文标题】：Handling 401 (Unauthorized) angularjs Authentication using JWT 【发布时间】：2019-06-09 00:32:19 【问题描述】：我有一个使用 web api 和 jwt 的 angularJS web 应用程序。我在这里按照互联网上的教程进行操作 > angularjs-jwt-auth 当我使用自己的 api 中的凭据登录时，一切正常，并在控制台上按应有的方式返回令牌。
但是当我尝试注册新用户时出现问题，没有任何反应，控制台向我抛出错误加载资源失败：服务器响应状态为 401（未授权）。当我使用教程中的 api 时工作正常，所以有点迷路，请帮忙！！
我的代码
(function ()
function authInterceptor(API, auth)
return
// automatically attach Authorization header
request: function (config)
config.headers = config.headers || ;
var token = auth.getToken();
if (config.url.indexOf(API) === 0 && token)
config.headers.Authorization = 'Bearer ' + token;
return config;
,
response: function (res)
if (res.config.url.indexOf(API) === 0 && res.data.token)
auth.saveToken(res.data.token);
return res;
,
// Services
function authService($window)
var srvc = this;
srvc.parseJwt = function (token)
var base64Url = token.split('.')[1];
var base64 = base64Url.replace('-', '+').replace('_', '/');
return JSON.parse($window.atob(base64));
;
srvc.saveToken = function (token)
$window.localStorage['jwtToken'] = token
;
srvc.logout = function (token)
$window.localStorage.removeItem('jwtToken');
;
srvc.getToken = function ()
return $window.localStorage['jwtToken'];
;
srvc.saveUsername = function (username)
$window.localStorage['username'] = username;
srvc.getUsername = function ()
return $window.localStorage['username'];
srvc.isAuthed = function ()
var token = srvc.getToken();
if (token)
var params = srvc.parseJwt(token);
return Math.round(new Date().getTime() / 1000) <= params.exp;
else
return false;
function userService($http, API, auth)
var srvc = this;
srvc.register = function (first_name, last_name, email, password, role, gender, phone_number)
return $http.post(API + '/api/v1/users/', // <-- Registration link here
first_name: first_name,
last_name: last_name,
email: email,
password: password,
role: role,
gender: gender,
phone_number: phone_number
);
srvc.login = function (username, password)
return $http.post(API + '/api/v1/token/auth/', // <-- Login link here
username: username,
password: password
);
;
return srvc;
// We won't touch anything in here
function MainCtrl(user, auth, $location, $state, $rootScope)
var self = this;
function handleRequest(res)
var token = res.data ? res.data.token : null;
if (token)
$location.path('/portfolio');
console.log('Bearer:', token);
auth.saveUsername($scope.username);
$rootScope.username = auth.getUsername();
// self.message = res.data.message;
self.login = function ()
user.login(self.username, self.password)
.then(handleRequest, handleRequest)
self.register = function ()
user.register(self.first_name, self.last_name, self.username, self.email, self.password, self.role, self.gender, self.phone_number)
.then(handleRequest, handleRequest)
self.logout = function ()
auth.logout && auth.logout();
$location.path('/login');
self.isAuthed = function ()
return auth.isAuthed ? auth.isAuthed() : false
angular
.module('App', ['ui.router'])
.factory('authInterceptor', authInterceptor)
.service('user', userService)
.service('auth', authService)
.constant('API', 'link-to-my-api') // <-- API Link here
.config(function ($stateProvider, $urlRouterProvider, $httpProvider)
【问题讨论】：
嘿@Geofrey。不幸的是，问题中的代码 sn-p 并没有说明如何或谁为新用户创建了新的 JWT 令牌。能否请您也添加该代码？ 【参考方案1】：由于 JWT 验证适用于本教程的 API，故障在于您的身份验证服务器，即 JWT 令牌的创建/验证）而不是上面的 sn-p（客户端处理）
由于创建的 JWT 令牌不正确或 JWT 令牌的验证不正确，您会收到 401
简要说明 JWT 如何进行身份验证。
在示例中，用户首先使用身份验证服务器的登录系统登录身份验证服务器。 身份验证服务器然后创建 JWT 并将其发送给用户。 当用户对应用程序进行 API 调用时，用户将 JWT 与 API 调用一起传递。 在此设置中，应用程序服务器将被配置为验证传入的 JWT 是否由身份验证服务器创建【讨论】：
您好，非常感谢您的回答。身份验证服务器 API 是由我的一位团队成员使用 python django 构建的。他不使用 angularjs 进行编码。当我尝试使用邮递员调用 API 时，它工作正常，但是当我尝试在客户端的应用程序上实现它时，我得到 401 ..但仅在注册时。我想知道也许我必须在客户端传递 API 令牌才能注册，但我不知道这样做。Angular Detect 401 Unauthorized Access 使用 JWT
】AngularDetect401UnauthorizedAccess使用JWT【英文标题】：AngularDetect401UnauthorizedAccessusingJWT【发布时间】：2018-08-0604:47:40【问题描述】：我按照几篇文章在Angular上实现JWT身份验证，似乎一切正常，除了检测401未授权。我想将用户重定向... 查看详情
Angular JWT Auth - 总是 401 未经授权
】AngularJWTAuth-总是401未经授权【英文标题】：AngularJWTAuth-always401unauthorized【发布时间】：2018-04-0820:10:01【问题描述】：我正在创建一个简单的cakephp后端。对于前端，我使用的是angular。Angular通过api路由（使用ADmadJWT插件）连接到... 查看详情
护照-jwt 总是返回 401 未授权
...【发布时间】：2019-08-2913:33:36【问题描述】：我正在尝试使用passport-jwt身份验证策略对nodejsapi进行身份验证，但它总是抛出401未经授权的错误。我尝试了各种实现，但passport.authenticate功能似乎不起作用。使用以下护照版本："护... 查看详情
使用 OpenID Connect ID 令牌时，Passport JWT 总是返回 401 未授权
】使用OpenIDConnectID令牌时，PassportJWT总是返回401未授权【英文标题】：PassportJWTisalwaysreturning401unauthorizedwhenusingOpenIDConnectIDToken【发布时间】：2017-11-1217:52:29【问题描述】：我正在按照本教程在我的expressAPI中启用jwt身份验证。https:... 查看详情
Nest.js Auth Guard JWT 身份验证不断返回 401 未授权
...401unauthorized【发布时间】：2020-10-2903:41:59【问题描述】：使用Postman测试我的端点，我能够成功“登录”并接收JWT令牌。现在，我正在尝试访问一个应该具有AuthGuard的端点，以确保我现在已经登录，现在可以访问它。 查看详情
Angular 2 JWT AuthHttp 错误 401 未捕获
】Angular2JWTAuthHttp错误401未捕获【英文标题】：Angular2JWTAuthHttperror401notcatched【发布时间】：2017-06-1002:32:44【问题描述】：我在Angular2中有这个功能，在正常情况下效果很好：privatecallGetUserService(url:string,id:string):Observable<any>retur... 查看详情
使用 http 全局服务 Angular 4.3、handleError、401、0 等、拦截器、jwt、标头处理错误
】使用http全局服务Angular4.3、handleError、401、0等、拦截器、jwt、标头处理错误【英文标题】：handlingerrorwithhttpglobalserviceangular4.3,handleError,401,0,etc,interceptor,jwt,headers【发布时间】：2018-01-1217:46:23【问题描述】：我有一个http全局服务... 查看详情
nodejs 和 Angular 应用程序使用 JWT 发送 401 Unauthorized 和 200 OK
】nodejs和Angular应用程序使用JWT发送401Unauthorized和200OK【英文标题】：nodejsandangularappsending401Unauthorizedand200OKwithJWT【发布时间】：2018-02-1216:35:53【问题描述】：当我在我的表单上单击注册时，据我所知，角度是在节点服务器可以授... 查看详情
使用 react-router 处理 401 未授权代码
】使用react-router处理401未授权代码【英文标题】：Handle401unauthorizedcodewithreact-router【发布时间】：2019-11-1211:34:45【问题描述】：我用一个函数来包装一些组件来处理错误，我们称之为：wrapError。这里有一些要点：一些组件调用端... 查看详情
如果刷新（JWT）令牌未经授权（401响应），AngularJS重定向到登录
】如果刷新（JWT）令牌未经授权（401响应），AngularJS重定向到登录【英文标题】：AngularJSredirecttologinifRefresh(JWT)tokengetsunauthorized(401response)【发布时间】：2019-07-1205:35:52【问题描述】：如果刷新(jwt)令牌未经授权（在第一个令牌过... 查看详情
为啥我在 Asp.Net CORE 中使用 JWT 获得 401 未经授权？
】为啥我在Asp.NetCORE中使用JWT获得401未经授权？【英文标题】：WhyI\'mgettinga401unauthorizedworkingwithJWTinAsp.NetCORE?为什么我在Asp.NetCORE中使用JWT获得401未经授权？【发布时间】：2020-08-2014:29:12【问题描述】：我正在尝试使用JsonWebTokens(JW... 查看详情
护照-jwt 总是返回“未经授权” - 401
...我正在尝试在我的应用程序中执行社交身份验证，为此我使用了两个模块：passport-google-oauth-20和passport-jwt。当用户使用google帐户成功登录时，我会创建一个令牌并将其作为具有“授权”标头类型的Be 查看详情
加载资源失败：服务器响应状态为 401（未授权）/App/AngularJS/angular.min.js
】加载资源失败：服务器响应状态为401（未授权）/App/AngularJS/angular.min.js【英文标题】：Failedtoloadresource:theserverrespondedwithastatusof401(Unauthorized)/App/AngularJS/angular.min.js【发布时间】：2014-11-1609:35:28【问题描述】：我遇到以下错误：Fa... 查看详情
.NET Core 中的 JWT 授权——401 错误
...的UI和WebAPI之间实现JWT身份验证。两者都是.NETCore2.0，我使用Ajax调用API函数。我可以毫无问题地登录，并将Bearer令牌传回给我；但是，当我使用Authorize装饰SaveProduct方法，使用A 查看详情
NodeJs：错误401（未经授权）我正在使用passport-jwt
】NodeJs：错误401（未经授权）我正在使用passport-jwt【英文标题】：NodeJs:Error401(Unauthorized)imusingpassport-jwt【发布时间】：2020-01-2822:11:11【问题描述】：我正在使用nodejsmongodb和passport-jwt中间件passport.authenticate登录进行身份验证应用... 查看详情
WebApi 2 在使用自定义 JWT 令牌进行授权时总是返回 401
】WebApi2在使用自定义JWT令牌进行授权时总是返回401【英文标题】：WebApi2alwaysreturning401onauthorizationusingcustomJWTtoken【发布时间】：2019-01-0313:13:53【问题描述】：我已经按照这个教程CreateaRESTfulAPIwithauthenticationusingWebAPIandJwt我设法让... 查看详情
Spring RequestMapping DELETE和未授权访问JWT
...4-0608:24:38【问题描述】：春天的DELETE方法有问题。我正在使用JWT并将其发送到请求标头中，但GET/POST/PATCH有效，DELETE无效..我真的不知道为什么。即使通过邮递员，我也无权401删除项目，但我 查看详情
处理 axios react-redux 应用程序中的 401 未授权错误
...它，我想调度一个动作来做到这一点。我看到很多人都在使用axios.interceptors我该怎么做。什么是拦截器？请详细解释它是什么并 查看详情