使用service过度error处理

src/app/api/http/http.service.ts

@@ -1,28 +1,34 @@
-import {Injectable} from '@angular/core';
+import {forwardRef, Inject, Injectable, Injector} from '@angular/core';
 import {RequestObj} from '../../class/HttpReqAndResp';
 import {HttpClient, HttpResponse} from '@angular/common/http';
 import {environment} from '../../../environments/environment';
 import {LocalStorageService} from '../../services/local-storage.service';
 import {Response} from '../../class/HttpReqAndResp';
-import {Observable, Observer, Subject} from 'rxjs';
+import {Observable, Observer, Subscription} from 'rxjs';
-import {ErrDispatch} from '../../class/ErrDispatch';
+import {ErrorService} from '../../services/error.service';
 
 @Injectable({
-    providedIn: 'root'
+    providedIn: 'root',
 })
 export class HttpService {
 
     constructor(private httpClient: HttpClient,
-                protected localStorageService: LocalStorageService) {
+                protected localStorageService: LocalStorageService,
+                private injector: Injector) {
     }
 
-    private errorDispatch: ErrDispatch;
+    private subscriptionQueue: Subscription[] = [];
 
-    setErrDispatch(errDispatch: ErrDispatch) {
+    // private errorDispatch: ErrDispatch;
-        this.errorDispatch = errDispatch;
+
-    }
+    public getSubscriptionQueue = () => this.subscriptionQueue;
+
+    // setErrDispatch(errDispatch: ErrDispatch) {
+    //     this.errorDispatch = errDispatch;
+    // }
 
     Service<T>(request: RequestObj) {
+        const errorService = this.injector.get(ErrorService);
         request.url = null;
         // 设置默认值
         request.contentType = request.contentType == null ? 'application/x-www-form-urlencoded' : request.contentType;
@@ -55,21 +61,30 @@ export class HttpService {
 
         const oob = new Observable<Response<T>>(o => observer = o);
 
-        observable.subscribe(o => {
+        const subscription = observable.subscribe({
+            next: o => {
                 const tokenFromReps = o.headers.get('Authorization');
                 if (tokenFromReps) {
                     this.localStorageService.setToken(tokenFromReps);
                 }
                 if (o.body.code !== 0) {
                     observer.error(o.body);
-                if (this.errorDispatch) {
+                    errorService.httpException(o.body)
-                    this.errorDispatch.errHandler(o.body.code, o.body.msg, request);
+                    // if (this.errorDispatch) {
-                }
+                    //     this.errorDispatch.errHandler(o.body.code, o.body.msg, request);
+                    // }
                 } else {
                     observer.next(o.body);
                 }
                 observer.complete();
+            },
+            error: err => {
+                errorService.httpError(err);
+                this.subscriptionQueue.splice(this.subscriptionQueue.indexOf(subscription), 1)
+            },
+            complete: () => this.subscriptionQueue.splice(this.subscriptionQueue.indexOf(subscription), 1)
         });
+        this.subscriptionQueue.push(subscription);
         return oob;
     }
 

src/app/app.module.ts

@@ -1,5 +1,5 @@
 import {BrowserModule} from '@angular/platform-browser';
-import {NgModule} from '@angular/core';
+import {forwardRef, NgModule} from '@angular/core';
 import {AppComponent} from './app.component';
 import {NgZorroAntdModule, NZ_I18N, zh_CN} from 'ng-zorro-antd';
 import {FormsModule} from '@angular/forms';
@@ -12,8 +12,14 @@ import {FooterComponent} from './components/footer/footer.component';
 import {AppRoutingModule} from './app-routing.module';
 import {LoginRegistrationModule} from './view/login-registration/login-registration.module';
 import {AdminModule} from './view/admin/admin.module';
-import { ServiceWorkerModule } from '@angular/service-worker';
+import {ServiceWorkerModule} from '@angular/service-worker';
-import { environment } from '../environments/environment';
+import {environment} from '../environments/environment';
+import {HttpService} from './api/http/http.service';
+import {ErrorService} from './services/error.service';
+import {ComponentStateService} from './services/component-state.service';
+import {GlobalUserService} from './services/global-user.service';
+import {LocalStorageService} from './services/local-storage.service';
+import {ApiService} from './api/api.service';
 
 
 registerLocaleData(zh);
@@ -33,9 +39,17 @@ registerLocaleData(zh);
         BrowserAnimationsModule,
         LoginRegistrationModule,
         AdminModule,
-        ServiceWorkerModule.register('ngsw-worker.js', { enabled: environment.production })
+        ServiceWorkerModule.register('ngsw-worker.js', {enabled: environment.production})
+    ],
+    providers: [
+        ComponentStateService,
+        GlobalUserService,
+        LocalStorageService,
+        HttpService,
+        ApiService,
+        ErrorService,
+        {provide: NZ_I18N, useValue: zh_CN},
     ],
-    providers: [{provide: NZ_I18N, useValue: zh_CN}],
     exports: [],
     bootstrap: [AppComponent]
 })

src/app/services/error.service.ts

@@ -0,0 +1,23 @@
+import {Injectable, Injector} from '@angular/core';
+import {Response} from '../class/HttpReqAndResp';
+import {HttpService} from '../api/http/http.service';
+
+@Injectable({
+    providedIn: 'root'
+})
+export class ErrorService {
+
+    constructor(private httpService: HttpService) {
+    }
+
+    public httpError(err: any) {
+        console.log('error=>', err)
+        // this.httpService.getSubscriptionQueue().map(a => a.unsubscribe())
+    }
+
+    public httpException(response: Response<any>) {
+        console.log('exception=>', response)
+    }
+
+
+}

src/app/view/index/index.component.ts

@@ -3,11 +3,9 @@ import {ApiService} from '../../api/api.service';
 import {Article} from '../../class/Article';
 import {NzIconService, NzMessageService} from 'ng-zorro-antd';
 import {SvgIconUtil} from '../../utils/svgIconUtil';
-import {PageList} from '../../class/HttpReqAndResp';
+import {PageList, RequestObj} from '../../class/HttpReqAndResp';
-import {ErrDispatch} from '../../class/ErrDispatch';
-import {RequestObj} from '../../class/HttpReqAndResp';
 import {Router} from '@angular/router';
-import {Category, Tag} from '../../class/Tag';
+import {Category} from '../../class/Tag';
 import {Title} from '@angular/platform-browser';
 
 @Component({
@@ -16,7 +14,7 @@ import {Title} from '@angular/platform-browser';
     styleUrls: ['./index.component.less'],
     providers: [ApiService]
 })
-export class IndexComponent implements OnInit, ErrDispatch {
+export class IndexComponent implements OnInit {
 
     constructor(private apiService: ApiService,
                 private iconService: NzIconService,
@@ -24,7 +22,6 @@ export class IndexComponent implements OnInit, ErrDispatch {
                 private router: Router,
                 private title: Title) {
         this.iconService.addIconLiteral('blog:location', SvgIconUtil.locationIcon);
-        // apiService.setErrDispatch(this);
         title.setTitle('小海博客');
     }
 

src/app/view/login-registration/components/registration/registration.component.ts

@@ -3,7 +3,6 @@ import {environment} from '../../../../../environments/environment';
 import {ApiService} from '../../../../api/api.service';
 import {NzMessageService} from 'ng-zorro-antd';
 import {Router} from '@angular/router';
-import {ErrDispatch} from '../../../../class/ErrDispatch';
 import {RequestObj} from '../../../../class/HttpReqAndResp';
 import {LoginReq} from '../../../../class/User';
 import {Title} from '@angular/platform-browser';
@@ -14,13 +13,12 @@ import {Title} from '@angular/platform-browser';
     styleUrls: ['./registration.component.less'],
     providers: [ApiService]
 })
-export class RegistrationComponent implements OnInit, ErrDispatch {
+export class RegistrationComponent implements OnInit {
 
     constructor(private apiService: ApiService,
                 private  nzMessageService: NzMessageService,
                 private router: Router,
                 private title: Title) {
-        // apiService.setErrDispatch(this);
         this.title.setTitle('小海博客 | 注册');
     }