如何将 ang2 @ngrx/store 传递给 http 拦截器以提醒 401/3 的应用程序？

Question

是否可以将 redux 存储传递给 angular2 中的拦截器？我需要在用户会话过期时触发应用程序更改，我认为最简单的方法是通过 redux 存储。

这是我的拦截器class:

@Injectable()
export class CrowdHttp extends Http {
    constructor(
        backend: ConnectionBackend,
        defaultOptions: RequestOptions,
        private _router: Router,
        private store: Store<any>)
    {
        super(backend, defaultOptions);
    }

    intercept(observable: Observable<Response>): Observable<Response> {
        return observable.catch((err, source) => {
            console.log( this.store );
            if (err.status  == 401 ) {
                this.store.dispatch(new NewLoggedInUserAction(null));
                return Observable.empty();
            } else {
                console.log( err );
                this.store.dispatch(new NewLoggedInUserAction(null));
                return Observable.throw(err);
            }
        });
    }

但是所说的class包含在主app.module.ts

的提供者中

@NgModule({
    imports: [
        BrowserModule,
        HttpModule,
        ReactiveFormsModule,
        AppRoutingModule,
        StoreModule.provideStore(
            StoreLoader.reducers(),
            StoreLoader.initialState()
        ),
        StoreDevtoolsModule.instrumentStore({
            monitor: useLogMonitor({
                visible: BootstrapDataService.reduxStoreDebug(),
                position: 'right'
            }),
        }),
        StoreLogMonitorModule
    ],
    declarations: [
        CrowdComponent,
    ],
    bootstrap: [CrowdComponent],
    providers: [
        AuthGuard,
        BootstrapDataService,
        AuthService,
        AuthResolver,
        {
            provide: APP_BASE_HREF,
            useValue: window.crowdRoute
        },
        {
            provide: Http,
            useFactory: (xhrBackend: XHRBackend, requestOptions: RequestOptions, router: Router) => new CrowdHttp(xhrBackend, requestOptions, router, store),
            deps: [XHRBackend, RequestOptions, Router]
        },
        {
            provide: BrowserXhr,
            useClass: CrowdBrowserXHR
        }
    ]
})
export class CrowdModule {
    constructor() {
        //optionally do something magical at this point...
    }
}

catch 运行良好，但我找不到将事件传递回应用程序其余部分的方法。传递的store不包含dispatch函数，报错：this.store.dispatch is not a function

我是用最好的方式解决这个问题还是有更好的选择？

Answer 1

尝试将 app.module.ts 中 http 提供商的当前设置替换为以下行：

{
    provide: Http,
    useFactory: (xhrBackend: XHRBackend, requestOptions: RequestOptions, router: Router, store: Store<any>) => new CrowdHttp(xhrBackend, requestOptions, router, store),
    deps: [XHRBackend, RequestOptions, Router, Store]
}

如何将 ang2 @ngrx/store 传递给 http 拦截器以提醒 401/3 的应用程序？

How to pass ang2 @ngrx/store to http interceptor to alert app of 401/3?

ngrx

angular