Angular 2 en español - JWT_API

Veamos el efecto disparado por la acción 'JWT_API_CALL_SET_ORDER':

@Effect()
setOrder$ = this.actions$
    .ofType('JWT_API_CALL_SET_ORDER')
    .switchMap(action => {
        return this.apiSetOrder(action.payload)
        .map((res: Response) => {
            if(res.isError && /* 401 token expired */){ 
                return new tokenRefreshAction(action);
            }
            return new setOrdeAction(res.data);
        })
    })

Puede devolver una acción setOrdeAction si todo ha ido bien o una acción 'tokenRefreshAction' si expiró el token. En este último caso tendremos otro side-effect, que consistirá en una petición para refrescar el token más relanzar la acción original que desencadenó todo esto:

@Effect()
refresh$ = this.actions$
  .ofType('TOKEN_REFRESH')
  .map(({payload}) => payload.originalAction)
  .flatMap(originalAction => {
      return this.refreshJWT().map((response) => {return [response, originalAction]});
    })
  .flatMap(([res, action]) => {
        return Observable.from([action, new saveNewTokenAction(res)]);
   })
  }
);

Angular 2 en español - Acciones

Desde que conocí Redux, mi forma de pensar en una aplicación siempre parte de las acciones y luego desarrollo el resto. (En concreto a día de hoy uso Angular2 con ngrx, una versión de Redux basada en RxJS).

Yo las acciones las divido en dos clases: aquellas cuya misión es modificar el store y aquellas cuya misión es un side-effect.

Por ejemplo, la acción SET_ORDER:

class SetOrderAction implements Action {
    readonly type: string;
    constructor(public payload: IOrder){}
}

modificará el store mientras que JWT_API_CALL_SET_ORDER es una acción cuyo cometido es un side-effect que consiste en una petición REST autorizada mediante JSON Web Token.

El orden sería el siguiente:

El usuario rellena el formulario y clicka en submit. Se lanza la acción JWT_API_CALL_SET_ORDER, que implica el lanzamiento de una petición REST. El JSON devuelto será el payload de la acción SET_ORDER que modificará el store mediante un reducer.

En el siguiente post hablaré sobre la acción JWT_API_CALL_SET_ORDER.

GitHub – miguelalarcos

Miguel Ángel Alarcos Torrecillas