網站搜尋

angular - 無法在 http 攔截器中注入服務


我需要如何設置這個 HttpInterceptor? oidcSecurityService 未定義。

HttpClient 允許您撰寫攔截器。一個常見的使用情境是攔截任何外發的 HTTP 請求並添加授權標頭。請記住,若透過建構函數將 OidcSecurityService 注入到攔截器中,會導致循環依賴。為避免此問題,請改用注入器。

@Injectable()
export class AuthInterceptor implements HttpInterceptor {
    private oidcSecurityService: OidcSecurityService;

    constructor(private injector: Injector) {}

    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        let requestToForward = req;

        if (this.oidcSecurityService === undefined) {
            this.oidcSecurityService = this.injector.get(OidcSecurityService);
        }
        if (this.oidcSecurityService !== undefined) {
            let token = this.oidcSecurityService.getToken();
            if (token !== '') {
                let tokenValue = 'Bearer ' + token;
                requestToForward = req.clone({ setHeaders: { Authorization: tokenValue } });
            }
        } else {
            console.debug('OidcSecurityService undefined: NO auth header!');
        }

        return next.handle(requestToForward);
    }
}

這在我的 app.module 中。我需要注入 OidcSecurityService。

  providers: [
    OidcSecurityService,
    OidcConfigService,
    {
      provide: APP_INITIALIZER,
      useFactory: loadConfig,
      deps: [OidcConfigService],
      multi: true
    },   
    AuthorizationGuard,
    {
      provide: HTTP_INTERCEPTORS, 
      useClass: AuthInterceptor, 
      multi: true
    }    
  ]

答案#1

試試這個—

@Injectable()
            export class AuthInterceptor implements HttpInterceptor {
                private oidcSecurityService: OidcSecurityService;

                constructor(private injector: Injector) { }

                intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
                    let requestToForward = req;
                    this.oidcSecurityService = this.injector.get(OidcSecurityService);
                    let token = this.oidcSecurityService.getToken();
                    if (token !== '') {
                        let tokenValue = 'Bearer ' + token;
                        requestToForward = req.clone({ setHeaders: { Authorization: tokenValue } });
                    }


                    return next.handle(requestToForward);
                }
            }
        }

答案#2

你可以直接在建構函式中注入服務:

   constructor(private oidcSecurityService : OidcSecurityService) { }

在建構函式中注入服務時曾經有一個錯誤,但這已在以下版本中修復:

Angular 5.2.3 於 2018 年 1 月 31 日發布

請檢查此答案:https://stackoverflow.com/a/48903734/3018671