角度洗掉請求不起作用。但郵遞員作業

服務端

 delete<T>(url: string): Observable<T> {
    return this.httpClient.delete<T>(`${url}`);
  }

設定服務

deleteTeamMember(companyId: number, userId: number): Observable<void> {
    return this.httpService.delete<void>(
      `${environment.urls.api}/company/${companyId}/team/${userId}`
    );
  }

組件.ts

 this.settingsService
          .deleteTeamMember(this.company.companyId, teamMember.userId)
          .subscribe(); //api call

上述 API 呼叫不起作用。它說 400 錯誤請求。它也有訪問令牌等。

API 回應

{
    "code": "BadRequest",
    "title": "Bad Request",
    "message": "Expected one of: <<{,[>> but got: <<EOF>>",
    "type": "tag:oracle.com,2020:error/BadRequest",
    "instance": "tag:oracle.com,2020:ecid/XgKKiZB497hJdOcC1jQxOQ"
}

但是相同的 API 和訪問令牌在 Postman 上運行良好。

你知道為什么嗎？

身份驗證攔截器

@Injectable()
export class AuthInterceptor implements HttpInterceptor {
  private isRefreshing = false;

  private refreshTokenSubject: BehaviorSubject<any> = new BehaviorSubject<any>(
    null
  );

  constructor(
    private authService: AuthService,
    private userDataService: UserDataService
  ) {}

  intercept(
    request: HttpRequest<any>,
    next: HttpHandler
  ): Observable<HttpEvent<any>> {
    let authRequest = request;
    const accessToken = this.userDataService.getAccessToken();

    if (accessToken != null) {
      authRequest = this.addTokenHeader(request, accessToken);
    }

    return next.handle(authRequest).pipe(
      catchError((error) => {
        if (
          error instanceof HttpErrorResponse &&
          !authRequest.url.includes('auth/sign-in') &&
          error.status === 401
        ) {
          return this.handle401Error(authRequest, next);
        }

        return throwError(error);
      })
    );
  }

  private handle401Error(
    request: HttpRequest<any>,
    next: HttpHandler
  ): Observable<HttpEvent<any>> {
    if (!this.isRefreshing) {
      this.isRefreshing = true;
      this.refreshTokenSubject.next(null);

      const refreshToken = this.userDataService.getRefreshToken();

      if (refreshToken) {
        return this.authService.refreshToken(refreshToken).pipe(
          switchMap((token: TokenModel) => {
            this.isRefreshing = false;

            this.userDataService.setAccessToken(token?.accessToken);
            this.userDataService.setRefreshToken(token?.refreshToken);

            this.refreshTokenSubject.next(token.accessToken); //get the 'accessToken' from refreshToken() call

            return next.handle(this.addTokenHeader(request, token.accessToken));
          }),
          catchError((err) => {
            this.isRefreshing = false;

            this.userDataService.setIsSignedOut(true); //Sign Out the app

            return throwError(err);
          })
        );
      }
    }

    return this.refreshTokenSubject.pipe(
      filter((accessToken) => accessToken !== null),
      take(1),
      switchMap((accessToken) =>
        next.handle(this.addTokenHeader(request, accessToken))
      )
    );
  }

  private addTokenHeader(
    request: HttpRequest<any>,
    accessToken: string
  ): HttpRequest<any> {
    return request.clone({
      setHeaders: {
        'Content-Type': 'application/json',
        'Access-Token': accessToken,
      },
    });
  }
}

uj5u.com熱心網友回復：

很可能只是'Content-Type': 'application/json'從攔截器中洗掉。Angular 在必要時會自動設定此標頭。洗掉請求不需要它。

private addTokenHeader(
    request: HttpRequest<any>,
    accessToken: string
  ): HttpRequest<any> {
    return request.clone({
      setHeaders: {
        'Content-Type': 'application/json', // REMOVE
        'Access-Token': accessToken,
      },
    });

標籤：有角度的打字稿离子框架邮差

上一篇：如何更改<ion-toolbar>中的陰影根元素以匹配<ion-toolbar>的高度？

下一篇：硬體后退按鈕不適用于Ionic和Angular