令牌服务，令牌拦截器帮助，令牌未存储，Angular 10

Question

有人能检查我的代码吗？令牌没有进入本地存储，也没有与令牌拦截器连接。当我检查网络选项卡时，它不会将其作为令牌端点。我知道本地存储不是最好的，但这个应用程序将在专用网络中使用。已删除导入以节省空间。

TokenService获取令牌：

@Injectable({
providedIn: 'root'
})
export class TokenService {
constructor(private http: HttpClient,) { }
public getToken(): Observable<any> {
const headers = new HttpHeaders({
'Access-Control-Allow-Origin': '*',
'Content-Type': 'application/x-www-form-urlencoded',
})
let body = new URLSearchParams()
body.set('username', 'alison')
body.set('grant_type', 'password')
body.set('password', 'password')
body.set('scope', 'Marketplace')
body.set('client_id', 'Api')
body.set('client_secret', 'Secret')
return this.http.post<{ access_token: string }>(`${tokenURl}/connect/token`, body, { headers: headers })
.pipe(
tap(res => {
localStorage.setItem('access_token', res.access_token);
console.log('access_token:' + JSON.stringify(res.access_token));
}));
}
}

令牌拦截器代码：

@Injectable()
export class TokenInterceptor implements HttpInterceptor {
constructor() { }
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
const isApiUrl = req.url.startsWith(Constants.apiRoot);
const bearerToken = localStorage.getItem('access_token');
if (isApiUrl) {
req = req.clone({
setHeaders: {
'Content-Type': 'application/json;',
'Accept': 'application/json',
'Authorization': `Bearer ${bearerToken}`,
},
});
}
return next.handle(req);
}
}

app.component.ts:

export class AppComponent {
constructor(private tokenService: TokenService,) { }
ngOnInit(): void {
this.tokenService.getToken().subscribe(
data => localStorage.setItem('access_token', data.access_token),
err => console.log(err),
);
}
}

app.module.ts

@NgModule({
imports: [
BrowserModule,
AppRoutingModule,
SharedModule,
WorksheetModule,
HttpClientModule,
],
declarations: [
AppComponent,
],
providers: [{
provide: HTTP_INTERCEPTORS,
useClass: TokenInterceptor,
multi: true
}],
bootstrap: [AppComponent],
})
export class AppModule { }

Answer 1

您没有订阅this.tokenService.getToken()，您的服务将以可观察的形式返回。

更改onInit():

ngOnInit(): void {
this.tokenService.getToken().subscribe();
}