【问题标题】:Angular getting Authorization token asynchronously before HTTP callsAngular 在 HTTP 调用之前异步获取授权令牌
【发布时间】:2023-04-07 10:03:01
【问题描述】:

在发布此之前,我去了许多其他类似的问题,但无法找到解决方案。喜欢Angular 2 - Inject authorization token before each Http request

我正在使用 AWS 会话,它为我提供了用于发出 HTTP 请求的授权令牌。现在获取会话可以是异步操作,具体取决于刷新令牌的需要。

问题: 我无法链接获取会话然后进行 HTTP 调用。

版本 Angular 5,RxJs 5.5.2

AuthService 的获取会话功能。

    getSession(): Observable<any> {
        const sessionOb = new Subject<CognitoUserSession>();
        // AysnFn4session is a callback implementation
        AysnFn4session((err, session) => { 
                console.log('Found Session');
                sessionOb.next(session);
                sessionOb.complete();
            });
        return sessionOb;
    }

API 服务的 get 函数 - Trail 1

get(url: string, options?: RequestOptionsArgs): Observable<Response> {
    return this._authService.getSession().switchMap((session) => {
      console.log('dasdasd');
      let token = '';
      if (session) {
        token = session.getIdToken().getJwtToken();
        options = options || {};
        options.headers = options.headers || new Headers();
        options.headers.append('Authorization', token);
      }
      return this._http.get(url, options);
    });
  }

API 服务的 get 函数 - Trail 2

get(url: string, options?: RequestOptionsArgs): Observable<Response> {
return this._authService.getSession().pipe(mergeMap((session) => {
  console.log('So what??');
  let token = '';
  if (session) {
    token = session.getIdToken().getJwtToken();
    options = options || {};
    options.headers = options.headers || new Headers();
    options.headers.append('Authorization', token);
  }
  return this._http.get(url, options);
}));
}

我如何称呼这个 api。

getItemInfo(item) {
return this._apiHttp.get('/assets/data/item.json')
  .map(res => {
    console.log(res);
    return res.json();
  })
  .subscribe(data => console.log(data),
     err => console.log(err), 
     () => console.log('done'));
}

现在问题是在这两种情况下控制台都只是打印。而不是进行 http 调用。

Found Session
done

我不明白我在使用 switchmap 的 mergemap 以完成 http 请求时出错的地方。

【问题讨论】:

  • 这个cognitoUser.getSession()和你的getSession方法一样吗?
  • @LLai cognitoUser.getSession 是 AWS coginito identioty 中使用回调函数的方法。简化相关代码以避免混淆。

标签: angular http rxjs rxjs5 switchmap


【解决方案1】:

错误在于getSession()。您的 AsynFn4session 回调在主题的观察者收听之前完成。 (主体的观察者仅接收在其订阅后发出的值)。这意味着观察者永远不会收到主题发射,因此可观察序列不会继续。我会使用可观察对象而不是主题

getSession(): Observable<any> {
    return new Observable(observer => {
        AsynFn4session((err, session) => {
            observer.next(session);
            observer.complete();
        });
    });
}

【讨论】:

  • 这行得通。谢谢你的解释。还有一个问题。在什么情况下主题好用?我看到大多数任务都可以通过使用 observable 来完成。
  • @gaurang171 主题通常用于将更改广播给多个观察者。例如,假设我将经过身份验证的用户存储在我的 authService 中。我可以让多个组件从 authService 订阅一个主题。现在,当该用户更改他/她的姓名时,我们可以告诉主题将更改发送给所有观察者,以便他们做出相应的反应。所以最大的区别是一个主题的观察者共享相同的数据源/流,而一个可观察对象的观察者有自己的数据源/流。
  • 感谢您的解释。我现在有了更好的理解。 :)
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2016-11-29
  • 1970-01-01
  • 2015-02-13
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多