angularjs 앱에서 안전한(!) 인증 시스템을 얻는 방법
난 앵귤제이가 처음이라...
저는 문서를 읽고 튜토리얼을 마쳤습니다.저도 뭔가 다른 것을 시도해봤더니 이해가 되기 시작했어요.
이제 어떻게 하면 안전한 인증 시스템을 만들 수 있을지 궁금합니다.
쉬운 부분: 코드가 없습니다. 코드가 실행되는 작업에 대해 설명합니다.
사용자 이름과 비밀번호 텍스트 입력의 클래식한 형식이 있습니다.
사용자가 양식에 입력하고 ENTER를 누릅니다.
Ajax 요청이 시작되고 응답은 "OK I know you" 또는 "I don't know you"와 같은 것을 알려주는 JSON입니다.
현재 필요한 것은 내 애플리케이션의 다른 뷰 사이에 방문자의 기록된 상태(또는 기록되지 않은 상태)를 표시하는 것입니다.
인터넷에서 읽은 바로는 이 목적을 달성하기 위해 누군가 변수($scope.isLogged = true)를 설정하고 다른 누군가는 쿠키를 사용하지만 javascript 변수나 쿠키는 firebug 또는 유사한 개발 도구를 사용하여 쉽게 편집할 수 있다고 합니다.
...마지막으로 다음과 같은 질문입니다.
그럼, angularjs 앱에서 안전한 인증 시스템을 실현하기 위한 제안이 있습니까?
사용자는 실행 환경(브라우저)에 대한 완전한 제어권을 가지고 있기 때문에 angularjs에서는 아무것도 허가할 수 없습니다.당신이 생각할 수 있는 어떤 것이든, 각각의 수표, 케이스는 변조될 수 있습니다.로컬 데이터를 안전하게 저장하기 위해 로컬 암호화를 수행하기 위해 비대칭 키를 사용하는 Javascript 라이브러리가 있지만 실제로 원하는 것은 아닙니다.
서버상의 작업을 세션으로 허가할 수 있습니다.일반 어플리케이션에서는 표준적인 방법으로 허가할 수 있습니다.특별한 코드는 필요 없습니다.Ajax 콜은 일반 세션쿠키를 사용합니다.애플리케이션은 인증 여부를 알 필요가 없습니다.서버의 생각만 체크하면 됩니다.
angularjs 어플리케이션의 관점에서 로그인 또는 로그아웃은 사용자에게 단순한 GUI 힌트에 불과합니다.
해결책을 찾으셨겠지만, 현재 저는 Angular App에서 구현하고 있는 인증 스킴을 만들었습니다.
.run에서 앱은 ActiveSession이 false로 설정된 상태로 등록됩니다.그런 다음 브라우저에 토큰과 userId가 포함된 쿠키가 있는지 확인합니다.
[YES]의 경우 토큰+사용자 체크서버의 ID로 서버와 로컬 모두에서 토큰을 업데이트합니다(각 사용자에 대해 고유한 서버 생성 키임을 나타냅니다).
NO 가 로그인 폼을 나타내고 있는 경우는, credential을 확인해 주세요.또한 유효한 경우는 서버가 새로운 토큰을 요구하여 로컬로 저장합니다.
토큰은 사용자가 브라우저 페이지를 새로 고칠 때 영구 로그인(3주 동안 나를 기억)하기 위해 사용됩니다.
감사해요.
나는 3개월 전에 이 질문을 했다.
Angular를 기반으로 구축된 웹 앱에서 사용자 인증을 처리할 때 가장 좋아하는 접근 방식을 공유합니다.JS.
물론 fdreger의 대답은 여전히 훌륭한 대답입니다!
사용자는 실행 환경(브라우저)에 대한 완전한 제어권을 가지고 있기 때문에 angularjs에서는 아무것도 허가할 수 없습니다.
angularjs 어플리케이션의 관점에서 로그인 또는 로그아웃은 사용자에게 단순한 GUI 힌트에 불과합니다.
간략하게 설명하자면 다음과 같습니다.
1) 루트 자체에 대한 추가 정보를 각 루트에 바인드합니다.
$routeProvider.when('/login', {
templateUrl: 'partials/login.html', controller: 'loginCtrl', isFree: true
});
2) 서비스를 이용하여 각 사용자의 데이터와 인증 상태를 관리한다.
services.factory('User', [function() {
return {
isLogged: false,
username: ''
};
}]);
3) 사용자가 새로운 루트에 접속하려고 할 때마다 접근 허가를 받았는지 확인합니다.
$root.$on('$routeChangeStart', function(event, currRoute, prevRoute){
// prevRoute.isFree tell me if this route is available for all the users, or only for registered user.
// User.isLogged tell me if the user is logged
})
또, 이 어프로치(자세한 것은)에 대해서도 블로그에 쓰고 있습니다.agularjs에 의한 사용자 인증입니다.
우선, 클라이언트측의 데이터는 항상 조작 또는 조작할 수 있습니다.
유효한 세션 ID를 쉽게 추측할 수 없고 세션 토큰을 클라이언트의 IP와 관련짓는 것과 같은 측정이 가능한 한 큰 문제는 없습니다.
이론적으로는 서버 측에서 쿠키를 암호화할 수도 있습니다.
쿠키를 암호화하는 방법에 대한 자세한 내용은 서버 측 문서를 참조하십시오(Express.js의 경우 http://expressjs.com/api.html#res.cookie 등).
서버측/데이터베이스측을알아야합니다.
사용자 로그인은 서버 측 데이터베이스에 99.9% 저장해야 합니다.
매우 안전한 시스템에서는 암호화된 패스워드를 유지하는 멤버테이블과 관련된 데이터베이스 테이블에 세션을 저장하는 백엔드(서버측) 멤버십시스템과 API 콜을 작성할 수 있는 RESTful 인터페이스를 제공하는 것이 이상적입니다.
제가 많이 사용한 스크립트는 Amber https://www.amember.com/ 입니다.이 방법은 비용 효율이 매우 높은 방법입니다.다른 스크립트는 많이 있습니다만, 저는 이 방법으로 많은 성공을 거두었습니다.또한 PHP이므로 각도 http 호출을 위한 API를 매우 쉽게 구축할 수 있습니다.
이러한 Javascript 프레임워크는 모두 훌륭하지만, 그 결과 너무 많은 사람들이 프런트 엔드에 집중하고 있습니다.데이터베이스/백엔드도 학습하세요!:-)
언급URL : https://stackoverflow.com/questions/14791361/how-to-achieve-a-safe-authentication-system-in-an-angularjs-app
'programing' 카테고리의 다른 글
Angular 1.5, 부모 컨트롤러에서 컴포넌트의 함수를 호출합니다. (0) | 2023.04.02 |
---|---|
모든 Axios 요청에 대한 Authorization 헤더 첨부 (0) | 2023.04.02 |
여러 JSON 개체를 가진 JSON 파일 로드 및 구문 분석 (0) | 2023.04.02 |
스프링 부트: 여러 SLF4J 바인딩 (0) | 2023.04.02 |
JSX React HTML5 입력 슬라이더가 작동하지 않음 (0) | 2023.04.02 |