时间戳

首页 > 解决方案 > 在特定时间可观察到的 Angular2 触发器

angular - 在特定时间可观察到的 Angular2 触发器

问题描述

所以首先有一点背景。我有一个 Angular 2 仪表板，它位于登录后面，并且也集成了信号器。对于通过 Angular 的 http 客户端发送的请求，我可以使用 url 拦截器检查令牌是否已过期，如果是，则从 api 请求新令牌。这适用于所有经过身份验证的调用，除了信号器。

在登录时使用信号器，我们建立连接并将承载令牌作为查询字符串的一部分发送。但是，由于信号器是独立的，因此不使用 angular s http 客户端，因此不会命中 url 拦截器。我一直在考虑不同的方法来处理这个问题，对我来说最干净的方法是订阅一个在令牌过期时触发的 observable。

所以现在我的问题是，如果我有一个到期日期，我可以写一个可观察的来触发说到期时间比当前时间早五分钟的时间。这样我就可以在我的信号器服务中订阅那个 observable 并断开并连接到更新的身份验证令牌。如果需要，我可以提供代码示例，但我不知道他们对我的问题有多大帮助。

感谢您对此的任何帮助。

标签： angularangular2-observablessubscribe

解决方案

我不了解信号器，但我可以为您的要求提供解决方案。

你可以使用timerfrom rxjs，这就像setTimeout()，但只是一个 Observable。

expirationDate在到期日期前五分钟为另一个创建日期对象。减去它们以找到 Observable 应该触发的时间。

以毫秒为单位将其传递time给您可以进行订阅的计时器。完成 API 调用后，再次调用相同的方法以重新初始化计时器。

timerSubs: Subscription;  // to cancel existing timer   
ngOnInit() {
    this.calculateTimeForTimer()
}

calculateTimeForTimer() {
    let expirationDate = new Date();
    expirationDate.setTime(expirationDate.getTime() + 10 * 1000); // 10 seconds from now.
    // in your case use your own duration/date of expiration
    let alertDate = new Date(expirationDate);
    alertDate.setTime(alertDate.getTime() - 5 * 1000); // 5 seconds before expiration
    // in your case subtract 5 minutes instead of 5 seconds
    let timeDuration = (expirationDate.getTime() - alertDate.getTime());
    this._startTimer(timeDuration);
}

private _startTimer(timeDuration) {
    if (this.timerSubs) {
        this.timerSubs.unsubscribe();
    }

    this.timerSubs = timer(timeDuration).subscribe((data) => {
      // make the API call, and then calculate appropriate duartion and call startTimer() again
      of("This is your new Token").pipe(delay(2000)).subscribe((apiData) => {
          console.log("Data from API", apiData);
          this.calculateTimeForTimer();
      })
    })
}

请参阅此处的示例，它与当前时间有 10 秒的到期日期。 https://stackblitz.com/edit/angular-bhupgg

推荐阅读