programing

cookieStore 및 AngularJS를 사용하여 사용자가 로그인 또는 로그아웃하는지 확인하는 모범 사례

closeapi 2023. 10. 8. 09:54
반응형

cookieStore 및 AngularJS를 사용하여 사용자가 로그인 또는 로그아웃하는지 확인하는 모범 사례

지금 저는 Angular를 만들고 있습니다.Ruby on Rails 위에 JS 기반 애플리케이션을 설치하고 디바이즈를 사용하여 인증합니다.사용자가 인증에 성공했을 때와 인증에 실패했을 때 서버가 적절하게 응답하도록 합니다.제 질문은 $cookieStore를 사용하여 사용자가 로그인되어 있는지 여부를 알 수 있는 가장 좋은 방법은 무엇인가요?"myapp_session"이라는 Rails에 의해 설정되는 쿠키가 있지만, 해당 세션이 반드시 사용자가 로그인되어 있는 것은 아닙니다.Angular를 사용하는 방법에 대한 아이디어를 찾고 있습니다.사용자의 온라인/오프라인 관리를 유지하기 위한 JS.승인이 필요한 요청은 솔루션에 관계없이 백엔드에서 승인할 수 있도록 할 것입니다.

서버에서 현재 사용자 세션을 요청하는 등 응용프로그램이 로드될 때 기록된 사용자를 설정하는 지시문을 작성할 수 있습니다.

angular.module('Auth', [
        'ngCookies'
    ])
    .factory('Auth', ['$cookieStore', function ($cookieStore) {

        var _user = {};

        return {

            user : _user,

            set: function (_user) {
                // you can retrive a user setted from another page, like login sucessful page.
                existing_cookie_user = $cookieStore.get('current.user');
                _user =  _user || existing_cookie_user;
                $cookieStore.put('current.user', _user);
            },

            remove: function () {
                $cookieStore.remove('current.user', _user);
            }
        };
    }])
;

그리고 당신의 것을.run메소드 인AppController:

   .run(['Auth', 'UserRestService', function run(Auth, UserRestService) {

            var _user = UserRestService.requestCurrentUser();
            Auth.set(_user);
        }])

물론 서버에 대한 요청이 있을 경우Http Status 401 - Unauthorized, 당신은 전화를 해야 합니다.Auth.remove()쿠키에서 사용자를 제거하고 사용자를 로그인 페이지로 리디렉션하는 서비스.

저는 이 접근법을 사용하며 매우 잘 작동합니다.사용할 수도 있습니다.localStorage, 하지만 사용자 데이터는 오랫동안 지속될 것입니다.이 인증에 대한 만료 날짜를 설정하지 않는 한 최선의 방법은 아닌 것 같습니다.

항상 서버 사이트에서 사용자 자격 증명 확인 =)

[편집]

들어보기401 - Unauthorized서버 응답, 당신은 당신의 서버에 인터셉터를 설치할 수 있습니다.$http다음과 같이 요청합니다.

 .config(['$urlRouterProvider', '$routeProvider', '$locationProvider', '$httpProvider', function ($urlRouterProvider, $routeProvider, $locationProvider, $httpProvider) {
        $urlRouterProvider.otherwise('/home');
        var interceptor = ['$location', '$q', function ($location, $q) {

            function success(response) {
                return response;
            }

            function error(response) {

                if (response.status === 401) {
                    $location.path('/login');
                    return $q.reject(response);
                }
                else {
                    return $q.reject(response);
                }
            }

            return function (promise) {
                return promise.then(success, error);
            };
        }];

        $httpProvider.responseInterceptors.push(interceptor);
    }])

통화할 때마다401응답, 사용자는 로그인 페이지로 리디렉션됩니다./login경로.

당신은 여기서 좋은 예를 발견할 것입니다.

로그인 콜백에서 쿠키를 설정할 수 있습니다.

$cookieStore.put('logged-in', some_value)

그런 다음 그들이 당신의 사이트에 들어갈 때 그것을 확인합니다.

.run(function($cookieStore) {
    if ($cookieStore.get('logged-in') === some_value) {
        let him enter
    }
    else {
        you shall not pass
    }
});

더 많은 "올바른" 방법이 있을 수 있지만, 이것은 효과가 있습니다.

답변이 받아들여지도록 하는데 문제가 있다면, Angular 1.3부터는 $httpProvider.interceptors에 추가하여 새로운 인터셉터를 추가하는 것이 적절한 방법이므로, 다음 대신에 다음과 같이 하십시오.

$httpProvider.responseInterceptors.push(interceptor);

용도:

$httpProvider.interceptors.push(interceptor);

언급URL : https://stackoverflow.com/questions/17982868/best-practice-for-ensure-user-is-logged-in-or-out-using-cookiestore-and-angularj

반응형