Question

我很麻烦。我试图用JavaScript阻止我的代码（是的，我知道这是不可能的）。

我正在使用async / await来执行一些工作，之后我想返回一个值。

这是代码

import {Injectable, Injector} from '@angular/core';
import {HttpEvent, HttpInterceptor, HttpHandler, HttpRequest} from '@angular/common/http';
import {Observable} from 'rxjs/Observable';
import {AuthService} from '../services/auth.service';

export const InterceptorSkipHeader = 'X-Skip-Interceptor';

@Injectable()
export class AuthInterceptor implements HttpInterceptor {

  constructor(private injector: Injector) {

  }

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
   /* const auth = this.injector.get(AuthService);

    if (req.headers.has(InterceptorSkipHeader)) {
      const headers = req.headers.delete(InterceptorSkipHeader);
      return next.handle(req.clone({headers}));
    }

    auth.getToken(s => {
      req = req.clone({
        setHeaders: {
          'Content-Type': 'application/json; charset=utf-8',
          'Authorization': 'Bearer ' + s
        }
      });
    }); ¨*/



    this.fetchUser()
      .then((user) => {
        console.log(user);
      });

    console.log("gets printed first");

    return next.handle(req);
  }

  async fetchUser() {
    try {
      const auth = await this.checkAuth(); // <- async operation
      const user = await this.getUser(auth); // <- async operation
      return user;
    } catch (error) {
      return {name: 'Default'};
    }
  }

  checkAuth() { return "hello"; }
  getUser(auth) { return "Kevin"; }
}

“首先打印”在“Kevin”打印之前打印。 Ergo：该函数在async / await函数完成之前返回。

任何解决方案？提前谢谢。

此致凯文

Answer 1

“首先打印”字符串在记录用户名之前打印，因为在下一个事件循环中触发了promise解析回调。从MDN documentation on promises我们可以看到：

在完成当前运行的JavaScript事件循环之前，永远不会调用回调。

即使在异步操作成功或失败之后，也会调用.then添加的回调，如上所述。

我猜你真正想要的是使用Angular guards检查用户是否经过身份验证，而不是在拦截器中执行此操作。

如何阻止Angular中的代码执行？

1 个答案: