我正在开发一个Webapp，用户可以在其中登录以查看其在线酒窖。
我已经安装了Django REST模型，以及Angular的前端设计，但是我很难将各个部分放在一起，主要问题是用户身份验证。
我已经阅读了许多关于此处和各种教程的文章，但似乎找不到逐步实现身份验证的方法：
据我了解，Angular在URL上发出POST请求，其中DRF验证用户名和密码是否匹配，并返回令牌或其他身份验证证明。
我感觉自己已经接近了，但是我需要更全面的了解如何将各个部分组合在一起。
提前致谢
我想有很多方法可以做到这一点，让我解释一下我所做的事情，希望对您有所帮助。这将是一个漫长的职位。我很想听听其他人如何做到这一点，或者更好的方法来实现相同的方法。您也可以在Angular-Django-Seed的Github上查看我的种子项目。
我将令牌身份验证与Witold Szczerba的http-auth-interceptor一起使用。他的方法的优点在于，每当从您的站点发送没有适当凭据的请求时，您都会被重定向到登录屏幕，但是您的请求将排队等待登录完成时被重新触发。
这是与登录表单一起使用的登录指令。它发布到Django的auth令牌端点，使用响应令牌设置cookie，使用令牌设置默认标头，以便所有请求都将通过身份验证，并触发http-auth-interceptor登录事件。
.directive('login', function ($http, $cookieStore, authService) {
return {
restrict: 'A',
link: function (scope, elem, attrs) {
elem.bind('submit', function () {
var user_data = {
"username": scope.username,
"password": scope.password,
};
$http.post(constants.serverAddress + "api-token-auth", user_data, {"Authorization": ""})
.success(function(response) {
$cookieStore.put('djangotoken', response.token);
$http.defaults.headers.common['Authorization'] = 'Token ' + response.token;
authService.loginConfirmed();
});
});
}
}
}）
我使用模块.run方法来设置用户访问网站时对cookie的检查，如果他们设置了cookie，则我设置了默认授权。
.run(function($rootScope) {
$rootScope.$broadcast('event:initial-auth');
})
这是我的拦截器指令，用于处理authService广播。如果需要登录，我将隐藏所有内容并显示登录表单。否则，隐藏登录表单并显示其他所有内容。
.directive('authApplication', function ($cookieStore, $http) {
return {
restrict: 'A',
link: function (scope, elem, attrs) {
var login = elem.find('#login-holder');
var main = elem.find('#main');
scope.$on('event:auth-loginRequired', function () {
main.hide();
login.slideDown('fast');
});
scope.$on('event:auth-loginConfirmed', function () {
main.show();
login.slideUp('fast');
});
scope.$on('event:initial-auth', function () {
if ($cookieStore.get('djangotoken')) {
$http.defaults.headers.common['Authorization'] = 'Token ' + $cookieStore.get('djangotoken');
}
else {
login.slideDown('fast');
main.hide();
}
});
}
}
})
要使用它，我所有的html基本上都是这样的。
<body auth-application>
<div id="login-holder">
... login form
</div>
<div id="main">
... ng-view, or the bulk of your html
</div>
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句