Ошибка с аутентификацией ngx-translate и Auth0

Я сделал проект на Angular 8 и включил оба ngx-translate (https://github.com/ngx-translate/core) и логин с использованием Auth0 (https://auth0.com/docs/quickstart/spa/angular2/01-login#install-the-sdk). Они хорошо работают по отдельности, но у меня возникает странная ошибка, когда они вместе.

Я получаю эту ошибку для каждого переведенного текста html в моем проекте в консоли.

core.js:6014 ERROR 
{error: "login_required", error_description: "Login required", state: "aGNHczdqZTRjMzFTM3ZtWnpIOS1kQjdXaXV2dktyVW94ZkdsYm5KVGhRSA=="}
error: "login_required"
error_description: "Login required"
state: "aGNHczdqZTRjMzFTM3ZtWnpIOS1kQjdXaXV2dktyVW94ZkdsYm5KVGhRSA=="
__proto__: Object

Когда я комментирую поставщика в моем app.module.ts перехватчика, который я сделал, чтобы добавить токен в мои запросы к бэкэнду, перевод работает хорошо, и все в порядке. Но тогда мой токен не будет отправлен на бэкэнд для моих запросов.

providers: [
    // {
    //   provide: HTTP_INTERCEPTORS,
    //   useClass: InterceptorService,
    //   multi: true
    // }
  ]

И когда я комментирую язык по умолчанию в моем AppComponent, у меня больше нет ошибок, токен отправляется на бэкэнд в моих запросах. Но тогда я не вижу текста в моем интерфейсе, потому что он не переведен.

export class AppComponent {  
  constructor(public translate: TranslateService) {
    // translate.setDefaultLang('en');
  }
}

Сначала кажется, что ошибка указывает на то, что я не вошел в систему, но она делает то же самое, когда я вхожу в систему.

Вот код моего класса перехватчика

import { Injectable } from '@angular/core';
import { HttpRequest, HttpHandler, HttpEvent, HttpInterceptor } from '@angular/common/http';
import { Observable, throwError } from 'rxjs';
import { mergeMap, catchError } from 'rxjs/operators';
import { AuthService } from './authentication/auth.service';

@Injectable({
  providedIn: 'root'
})
export class InterceptorService implements HttpInterceptor {

  constructor(private authService: AuthService) { }

  public intercept(
    req: HttpRequest<any>,
    next: HttpHandler
  ): Observable<HttpEvent<any>> {
    return this.authService.getTokenSilently$().pipe(
      mergeMap(token => {
        const tokenReq = req.clone({
          setHeaders: { Authorization: `Bearer ${token}` }
        });
        return next.handle(tokenReq);
      }),
      catchError(err => throwError(err))
    );
  }
}

Спасибо


person Mathieu Giguere    schedule 18.12.2019    source источник


Ответы (1)


Я работаю с сообществом Auth0. Похоже, это не имеет прямого отношения к Auth0, поскольку похоже, что вы успешно подтверждаете свое состояние / сеанс. Я не на 100% знаком с NGX Translate, но я нашел руководство по этому поводу, которое может вам помочь. Прошу прощения, я не могу более подробно рассказать об этом.

https://www.codeandweb.com/babeledit/tutorials/how-to-translate-your-angular8-app-with-ngx-translate

person Coding Morrison    schedule 27.12.2019