Angular——只在值尚未被请求时才使用Observable

Question

我有一个web应用程序，有时需要使用Token来访问我的第三方合作伙伴端点。

此令牌位于我的数据库中，并在我自己服务器的端点上获得。

我试图建立一个结构，只请求令牌在我的后端，一些需要它的函数第一次被调用。当我已经有了这个令牌，我将在我的局部变量上使用它。

export class Service {
private readonly api_url: string = environment.API_URL;
private token: string;
getToken(): Observable<any> {
// HTTP call to get the token on my own backend and return the token
}
partnerFirstFunction(): Observable<any> {
if (!this.token)
this.getToken().subscribe((response) => {
this.token = response;
var headers = new HttpHeaders({ 'Authorization': 'bearer ' + this.token });
return this.http.request<any>('POST', 'partnerUrl', { headers: headers }).pipe(map(response => {
return response;
}));
});
// I WANT TO PREVENT THE ABOVE CODE FROM REPEATING
else {
var headers = new HttpHeaders({ 'Authorization': 'bearer ' + this.token });
return this.http.request<any>('POST', 'partnerUrl', { headers: headers }).pipe(map(response => {
return response;
}));
}
}
partnerSecFunction(): Observable<any> {
if (!this.token)
this.getToken().subscribe((response) => {
this.token = response;
var headers = new HttpHeaders({ 'Authorization': 'bearer ' + this.token });
return this.http.request<any>('POST', 'partnerUrl', { headers: headers }).pipe(map(response => {
return response;
}));
});
// I WANT TO PREVENT THE ABOVE CODE FROM REPEATING
else {
var headers = new HttpHeaders({ 'Authorization': 'bearer ' + this.token });
return this.http.request<any>('PATCH', 'partnerUrl', { headers: headers }).pipe(map(response => {
return response;
}));
}
}
}

我试图建立一个get/set到我的令牌变量，使"已经存在";在get方法内进行验证，但当需要请求令牌时，代码继续而不等待请求。

private _token: string;
get token(): string {
if (this._token == null)
this.getToken().subscribe((response) => {
return this._token;
});
else
return this._token;
}

Answer 1

你可以在你的HTTP请求中使用shareereplay操作符，并将其分配给一个可观察的token$，你可以使用它来获取令牌，然后将结果切换/合并映射到其他请求。

您可以尝试以下操作:

export class Service {
token$: Observable<string>;
constructor() {
// shareReplay will share the result of the request for all subscribers
// replace of('NEW_TOKEN') with your http request.
this.token$ = of('NEW_TOKEN').pipe(shareReplay(1));
}
partnerFirstFunction(): Observable<any> {
return this.token$.pipe(
switchMap(token => {
var headers = new HttpHeaders({
Authorization: 'bearer ' + token
});
return this.http
.request<any>('POST', 'partnerUrl', { headers: headers })
.pipe(
map(response => {
return response;
})
);
})
);
}
partnerSecFunction(): Observable<any> {
return this.token$.pipe(
switchMap(token => {
var headers = new HttpHeaders({
Authorization: 'bearer ' + token
});
return this.http
.request<any>('PATCH', 'partnerUrl', { headers: headers })
.pipe(
map(response => {
return response;
})
);
})
);
}
}

Answer 2

也许你应该用

private static token: string;

因此令牌字段将为Service类的所有实例初始化一次