Solution Needed for Request Cancellation Issue
Encountering a problem with the usage of HttpInterceptor to include the Authorize header in all HTTP requests sent to AWS API Gateway. The issue arises as all these requests are getting cancelled when intercepted.
To resolve this, an interceptor was added that calls this.getSession(), returning an Observable from a Promise:
intercept (request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
return this.getSession()
.mergeMap((session: CognitoUserSession) => {
if(session.getIdToken()){
request = request.clone({
setHeaders: {
Authorization: session.getIdToken().getJwtToken()
}
});
}
return next.handle(request);
});
}
The request execution is demonstrated below:
getStoreList(): Observable<string[]> {
let uri = endpoint + 'getStores';
return this.http.get<string[]>(uri, {headers: httpHeaders}).pipe(
map((data) => {
return data;
}));
}
this.updateHistoryService.getStoreList()
.subscribe((data: string[]) => {
this.stores = ["all", ...data];
this.getData();
});
However, the current setup results in the error message: "XHR failed loading: OPTIONS """ (CORS is utilized, triggering a pre-flight request.)
Implemented Solutions so Far
Attempting various solutions, including modifying the handling line:
return next.handle(request);
to:
return from(next.handle(request).toPromise());
//alternate method:
return next.handle(request).toPromise();
Although the console reflects successful server data retrieval without any cancellations upon making these adjustments, the callback function fails to trigger properly, leading to inability to process the retrieved data.