2016-09-23 3 views
1

로그인 후 3600으로 설정된 세션 카운트 다운으로 앱을 제작 중입니다.Angular 2 + ngrx : 세션 타이머 구현

타이머가 60에 도달하면 앱이 세션을 연장하라는 경고 메시지를 표시해야합니다. 타이머가 0에 도달하면 앱이 로그 아웃해야합니다.

일부 요청 (POST)은 세션 타이머를 재설정하고 다른 요청 (POST)은 세션 타이머를 재설정하지 않습니다.

나는 login, login_success 등의 케이스와 auth.effect 클래스를 처리하는 auth.reducer을 가지고 있는데, 여기에서 session-duration을 서버에서 반환 된 실제 기간으로 설정합니다.

내 질문은 :

  1. 가 어디 넣고 Observable.timer/interval 시작합니까?

    • dashboard.component
    • auth.effects
    • auth.service
  2. 내가 작업 DECREMENT_TIMER을 만들 마십시오 난 그냥 행동 관찰이 카운트 다운을 완료 TIMER_TIMEOUT을 만들려면 어떻게해야합니까 : 나는 다음과 같은 옵션이 있습니다?

  3. AuthState는 어떻게 포맷해야합니까? 매초마다 sessionSecondsLeft 카운터가 감소하여 DECREMENT_TIMER으로 감소합니까 아니면 countdown_at_60countdown_finished 속성을 갖는 것이 더 낫습니까?

가장 좋은 방법은 무엇입니까?

나의 제안을 (당신이 매장 DevTools로를 사용하는 경우)

답변

2

DECREMENT_TIMER 조치는 초당 한 번 당신의 상태를 업데이트하고 것 스팸 당신의 작업 로그 것 :

액션 TIMER_RESET을 만듭니다. 저장소에 타임 스탬프를 저장할 수는 있지만 표시하려면 1 분 미만이 될 때까지 필요하지 않다고 생각합니다.

@Effect() TIMER_RESET$ = this.actions$ 
    .ofType(TIMER_RESET) 
    .switchMap(
    Observable.concat(
     Observable.timer(1000*60*59).map({type: TIMER_WARNING}), 
     Observable.timer(1000*60*1).map({type: TIMER_EXPIRED}) 
    ) 
) 
+0

의견을 보내 주셔서 감사합니다. 나는 TIMER_RESET 동작을 호출하기 위해 3600 - 60 카운트 다운이 될 다른 타이머를 구현해야한다는 것을 이해한다. 그래도 한 가지 질문이 있습니다. 그 타이머는 어디에 둘까요? auth.service 또는 dashboard.component? –

+0

음, 아니. 'TIMER_RESET'이 실행 된 후 첫 번째 Observable은 59 분 후에'TIMER_WARNING'을 보내고, 두 번째 것은 1 분 후에'TIMER_EXPIRED'를 전달합니다. 'Observable.concat()'은 전달 된 Observables _ sequence_에 가입합니다. 전에 또 다른'TIMER_RESET'이 디스패치되면, 두 타이머는 새로운 타이머를 위해 버려집니다. – j2L4e

+0

자, 이제 login_success 또는 매 POST 요청 후에 timer_reset을 호출합니다. 감사. –