Issue
I have a function getHash
that retrieves a hash value that I need from a remote api server. I am using the following code for it, which uses the auth0
service to retrieve the jwt token
, attach it to the request and then return the http.get
Observable
The issue I am facing now is that this function returns a subscription
which when I try to read using .subscribe
it returns the error subscribe is not a funciton
To solve that I tried to return let res = await this.http.get(url, httpOptions).toPromise()
instead of the simple return value that I have right now but that just returns an undefined response.
I am not sure whats happening right now, is there something wrong with the way I am returning inside subscribe
inside the getHash()
function? Any help would be appreciated?
getHash(): any {
return this.authService.getAccessTokenSilently()
.subscribe(jwt => {
let httpOptions = {
headers: new HttpHeaders({
'Content-Type': 'application/json',
'Authorization': `Bearer ${jwt}`
})
};
const decodedToken = window.atob(jwt.split('.')[1]);
const jwtoken = JSON.parse(decodedToken);
const url = `${commonEnv.baseUrl}/${jwtoken.sub}/hash`
return this.http.get(url, httpOptions)
})
}
Solution
Your code in getHash
is performing some asynchronous work and therefore you can not expect that the function getHash
returns the value you want.
What it can return is an Observable which notifies your hash when it becomes available. As in any asyn implementation, you have to pass a function that will process the value (the hash in your case) when it becomes available.
While this is generally true for any async processing, in your case, using Observable, you could restructure your code along these lines
// the function returns an Observable that has to be subscribed by the caller
// of the function
getHash(): Observable<any> {
// you start from the getAccessTokenSilently method which returns an
// Observable which notifies the jwt token
return this.authService.getAccessTokenSilently().pipe(
// we start a pipe to transform the Observable returned by getAccessTokenSilently
// the transformation is a concatenation: we concatenate the
// Observable returned by getAccessTokenSilently with the Observable
// returned by http.get - this means that we wait for the Observable
// returned by getAccessTokenSilently to notify the jwt value and then
// we kick off the Observable returned by http.get
// this transformation is achieved using the concatMap operator like this
concatMap(jwt => {
let httpOptions = {
headers: new HttpHeaders({
'Content-Type': 'application/json',
'Authorization': `Bearer ${jwt}`
})
};
const decodedToken = window.atob(jwt.split('.')[1]);
const jwtoken = JSON.parse(decodedToken);
const url = `${commonEnv.baseUrl}/${jwtoken.sub}/hash`
})
}
Now getHash
returns an Observable which will notify the hash when available.
Whoever needs to use this hash has to subscribe to this Oservable like this
getHash().subscribe(hash => {
// do whatever is necessary with the hash
})
Answered By - Picci
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.