1. 在app.module.ts文件中导入OAuthModule和HttpClientModule。

import { HttpClientModule } from '@angular/common/http'; import { OAuthModule } from 'angular-oauth2-oidc'; ...

@NgModule({ imports: [ HttpClientModule, ... OAuthModule.forRoot() ], ... })

2. 在Service中使用OAuthService手动设置accessToken，并在请求的headers中添加Authorization。

import { Injectable } from '@angular/core'; import { HttpClient, HttpHeaders } from '@angular/common/http'; import { OAuthService } from 'angular-oauth2-oidc';

@Injectable({ providedIn: 'root' }) export class MyService { constructor(private http: HttpClient, private oauthService: OAuthService) {}

getData() { const token = this.oauthService.getAccessToken();

const httpOptions = {
  headers: new HttpHeaders({
    'Content-Type': 'application/json',
    Authorization: 'Bearer ' + token
  })
};

return this.http.get('/api/data', httpOptions);

} }

3. 在拦截器中使用OAuthService自动添加accessToken到请求headers中。

import { Injectable } from '@angular/core'; import { HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http'; import { Observable } from 'rxjs'; import { OAuthService } from 'angular-oauth2-oidc';

@Injectable() export class TokenInterceptor implements HttpInterceptor { constructor(private oauthService: OAuthService) {}

intercept(request: HttpRequest, next: HttpHandler): Observable> { const token = this.oauthService.getAccessToken();

if (token) {
  request = request.clone({
    setHeaders: {
      Authorization: `Bearer ${token}`
    }
  });
}

return next.handle(request);

} }

4. 在app.module.ts中注册拦截器。

import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http'; import { OAuthModule } from 'angular-oauth2-oidc'; import { TokenInterceptor } from './token-interceptor';

...

@NgModule({ imports: [ HttpClientModule, ... OAuthModule.forRoot() ], ... providers: [ { provide: HTTP_INTERCEPTORS, useClass: TokenInterceptor, multi: true } ] })

这些解决方案将确保OAuth2 OIDC Bearer Token可以在服务请求中正确使用。