]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blobdiff - client/src/app/core/auth/auth.service.ts
add redirect after login (#1110)
[github/Chocobozzz/PeerTube.git] / client / src / app / core / auth / auth.service.ts
index bc276ed99a35c2cc9862ab47e163ee4229ff9c6b..8ff5713a11805370047335b1024786c42a7afcf5 100644 (file)
-import { Injectable } from '@angular/core';
-import { Headers, Http, Response, URLSearchParams } from '@angular/http';
-import { Router } from '@angular/router';
-import { Observable } from 'rxjs/Observable';
-import { Subject } from 'rxjs/Subject';
-import 'rxjs/add/operator/map';
-import 'rxjs/add/operator/mergeMap';
-
-// Do not use the barrel (dependency loop)
-import { AuthStatus } from '../../shared/auth/auth-status.model';
-import { AuthUser } from '../../shared/auth/auth-user.model';
-import { RestExtractor } from '../../shared/rest';
+import { Observable, ReplaySubject, Subject, throwError as observableThrowError } from 'rxjs'
+import { catchError, map, mergeMap, share, tap } from 'rxjs/operators'
+import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http'
+import { Injectable } from '@angular/core'
+import { Router } from '@angular/router'
+import { NotificationsService } from 'angular2-notifications'
+import { OAuthClientLocal, User as UserServerModel, UserRefreshToken } from '../../../../../shared'
+import { User } from '../../../../../shared/models/users'
+import { UserLogin } from '../../../../../shared/models/users/user-login.model'
+import { environment } from '../../../environments/environment'
+import { RestExtractor } from '../../shared/rest'
+import { AuthStatus } from './auth-status.model'
+import { AuthUser } from './auth-user.model'
+import { objectToUrlEncoded } from '@app/shared/misc/utils'
+import { peertubeLocalStorage } from '@app/shared/misc/peertube-local-storage'
+import { I18n } from '@ngx-translate/i18n-polyfill'
+import { HotkeysService, Hotkey } from 'angular2-hotkeys'
+
+interface UserLoginWithUsername extends UserLogin {
+  access_token: string
+  refresh_token: string
+  token_type: string
+  username: string
+}
+
+type UserLoginWithUserInformation = UserLoginWithUsername & User
 
 @Injectable()
 export class AuthService {
-  private static BASE_CLIENT_URL = '/api/v1/clients/local';
-  private static BASE_TOKEN_URL = '/api/v1/users/token';
-  private static BASE_USER_INFORMATIONS_URL = '/api/v1/users/me';
-
-  loginChangedSource: Observable<AuthStatus>;
-
-  private clientId: string;
-  private clientSecret: string;
-  private loginChanged: Subject<AuthStatus>;
-  private user: AuthUser = null;
+  private static BASE_CLIENT_URL = environment.apiUrl + '/api/v1/oauth-clients/local'
+  private static BASE_TOKEN_URL = environment.apiUrl + '/api/v1/users/token'
+  private static BASE_USER_INFORMATION_URL = environment.apiUrl + '/api/v1/users/me'
+  private static LOCAL_STORAGE_OAUTH_CLIENT_KEYS = {
+    CLIENT_ID: 'client_id',
+    CLIENT_SECRET: 'client_secret'
+  }
 
-  constructor(
-    private http: Http,
+  loginChangedSource: Observable<AuthStatus>
+  userInformationLoaded = new ReplaySubject<boolean>(1)
+  hotkeys: Hotkey[]
+  redirectUrl: string
+
+  private clientId: string = peertubeLocalStorage.getItem(AuthService.LOCAL_STORAGE_OAUTH_CLIENT_KEYS.CLIENT_ID)
+  private clientSecret: string = peertubeLocalStorage.getItem(AuthService.LOCAL_STORAGE_OAUTH_CLIENT_KEYS.CLIENT_SECRET)
+  private loginChanged: Subject<AuthStatus>
+  private user: AuthUser = null
+  private refreshingTokenObservable: Observable<any>
+
+  constructor (
+    private http: HttpClient,
+    private notificationsService: NotificationsService,
+    private hotkeysService: HotkeysService,
     private restExtractor: RestExtractor,
-    private router: Router
-   ) {
-    this.loginChanged = new Subject<AuthStatus>();
-    this.loginChangedSource = this.loginChanged.asObservable();
-
-    // Fetch the client_id/client_secret
-    // FIXME: save in local storage?
-    this.http.get(AuthService.BASE_CLIENT_URL)
-      .map(this.restExtractor.extractDataGet)
-      .catch((res) => this.restExtractor.handleError(res))
-      .subscribe(
-        result => {
-          this.clientId = result.client_id;
-          this.clientSecret = result.client_secret;
-          console.log('Client credentials loaded.');
-        },
-        error => {
-          alert(
-            `Cannot retrieve OAuth Client credentials: ${error.text}. \n` +
-            'Ensure you have correctly configured PeerTube (config/ directory), in particular the "webserver" section.'
-          );
-        }
-      );
+    private router: Router,
+    private i18n: I18n
+  ) {
+    this.loginChanged = new Subject<AuthStatus>()
+    this.loginChangedSource = this.loginChanged.asObservable()
 
     // Return null if there is nothing to load
-    this.user = AuthUser.load();
+    this.user = AuthUser.load()
+
+    // Set HotKeys
+    this.hotkeys = [
+      new Hotkey('m s', (event: KeyboardEvent): boolean => {
+        this.router.navigate([ '/videos/subscriptions' ])
+        return false
+      }, undefined, 'Go to my subscriptions'),
+      new Hotkey('m v', (event: KeyboardEvent): boolean => {
+        this.router.navigate([ '/my-account/videos' ])
+        return false
+      }, undefined, 'Go to my videos'),
+      new Hotkey('m i', (event: KeyboardEvent): boolean => {
+        this.router.navigate([ '/my-account/video-imports' ])
+        return false
+      }, undefined, 'Go to my imports'),
+      new Hotkey('m c', (event: KeyboardEvent): boolean => {
+        this.router.navigate([ '/my-account/video-channels' ])
+        return false
+      }, undefined, 'Go to my channels')
+    ]
   }
 
-  getRefreshToken() {
-    if (this.user === null) return null;
-
-    return this.user.getRefreshToken();
+  loadClientCredentials () {
+    // Fetch the client_id/client_secret
+    this.http.get<OAuthClientLocal>(AuthService.BASE_CLIENT_URL)
+        .pipe(catchError(res => this.restExtractor.handleError(res)))
+        .subscribe(
+          res => {
+            this.clientId = res.client_id
+            this.clientSecret = res.client_secret
+
+            peertubeLocalStorage.setItem(AuthService.LOCAL_STORAGE_OAUTH_CLIENT_KEYS.CLIENT_ID, this.clientId)
+            peertubeLocalStorage.setItem(AuthService.LOCAL_STORAGE_OAUTH_CLIENT_KEYS.CLIENT_SECRET, this.clientSecret)
+
+            console.log('Client credentials loaded.')
+          },
+
+          error => {
+            let errorMessage = error.message
+
+            if (error.status === 403) {
+              errorMessage = this.i18n('Cannot retrieve OAuth Client credentials: {{errorText}}.\n', { errorText: error.text })
+              errorMessage += this.i18n(
+                'Ensure you have correctly configured PeerTube (config/ directory), in particular the "webserver" section.'
+              )
+            }
+
+            // We put a bigger timeout
+            // This is an important message
+            this.notificationsService.error(this.i18n('Error'), errorMessage, { timeOut: 7000 })
+          }
+        )
   }
 
-  getRequestHeaderValue() {
-    return `${this.getTokenType()} ${this.getAccessToken()}`;
+  getRefreshToken () {
+    if (this.user === null) return null
+
+    return this.user.getRefreshToken()
   }
 
-  getAccessToken() {
-    if (this.user === null) return null;
+  getRequestHeaderValue () {
+    const accessToken = this.getAccessToken()
 
-    return this.user.getAccessToken();
+    if (accessToken === null) return null
+
+    return `${this.getTokenType()} ${accessToken}`
   }
 
-  getTokenType() {
-    if (this.user === null) return null;
+  getAccessToken () {
+    if (this.user === null) return null
 
-    return this.user.getTokenType();
+    return this.user.getAccessToken()
   }
 
-  getUser(): AuthUser {
-    return this.user;
+  getTokenType () {
+    if (this.user === null) return null
+
+    return this.user.getTokenType()
   }
 
-  isAdmin() {
-    if (this.user === null) return false;
+  getUser () {
+    return this.user
+  }
 
-    return this.user.isAdmin();
+  isLoggedIn () {
+    return !!this.getAccessToken()
   }
 
-  isLoggedIn() {
-    if (this.getAccessToken()) {
-      return true;
-    } else {
-      return false;
+  login (username: string, password: string) {
+    // Form url encoded
+    const body = {
+      client_id: this.clientId,
+      client_secret: this.clientSecret,
+      response_type: 'code',
+      grant_type: 'password',
+      scope: 'upload',
+      username,
+      password
     }
+
+    const headers = new HttpHeaders().set('Content-Type', 'application/x-www-form-urlencoded')
+    return this.http.post<UserLogin>(AuthService.BASE_TOKEN_URL, objectToUrlEncoded(body), { headers })
+               .pipe(
+                 map(res => Object.assign(res, { username })),
+                 mergeMap(res => this.mergeUserInformation(res)),
+                 map(res => this.handleLogin(res)),
+                 catchError(res => this.restExtractor.handleError(res))
+               )
   }
 
-  login(username: string, password: string) {
-    let body = new URLSearchParams();
-    body.set('client_id', this.clientId);
-    body.set('client_secret', this.clientSecret);
-    body.set('response_type', 'code');
-    body.set('grant_type', 'password');
-    body.set('scope', 'upload');
-    body.set('username', username);
-    body.set('password', password);
+  logout () {
+    // TODO: make an HTTP request to revoke the tokens
+    this.user = null
+
+    AuthUser.flush()
 
-    let headers = new Headers();
-    headers.append('Content-Type', 'application/x-www-form-urlencoded');
+    this.setStatus(AuthStatus.LoggedOut)
 
-    let options = {
-      headers: headers
-    };
+    this.hotkeysService.remove(this.hotkeys)
 
-    return this.http.post(AuthService.BASE_TOKEN_URL, body.toString(), options)
-                    .map(this.restExtractor.extractDataGet)
-                    .map(res => {
-                      res.username = username;
-                      return res;
-                    })
-                    .flatMap(res => this.fetchUserInformations(res))
-                    .map(res => this.handleLogin(res))
-                    .catch((res) => this.restExtractor.handleError(res));
+    this.redirectUrl = null
   }
 
-  logout() {
-    // TODO: make an HTTP request to revoke the tokens
-    this.user = null;
+  refreshAccessToken () {
+    if (this.refreshingTokenObservable) return this.refreshingTokenObservable
 
-    AuthUser.flush();
+    console.log('Refreshing token...')
 
-    this.setStatus(AuthStatus.LoggedOut);
-  }
+    const refreshToken = this.getRefreshToken()
+
+    // Form url encoded
+    const body = new HttpParams().set('refresh_token', refreshToken)
+                                 .set('client_id', this.clientId)
+                                 .set('client_secret', this.clientSecret)
+                                 .set('response_type', 'code')
+                                 .set('grant_type', 'refresh_token')
 
-  refreshAccessToken() {
-    console.log('Refreshing token...');
+    const headers = new HttpHeaders().set('Content-Type', 'application/x-www-form-urlencoded')
 
-    const refreshToken = this.getRefreshToken();
+    this.refreshingTokenObservable = this.http.post<UserRefreshToken>(AuthService.BASE_TOKEN_URL, body, { headers })
+                                         .pipe(
+                                           map(res => this.handleRefreshToken(res)),
+                                           tap(() => this.refreshingTokenObservable = null),
+                                           catchError(err => {
+                                             this.refreshingTokenObservable = null
 
-    let body = new URLSearchParams();
-    body.set('refresh_token', refreshToken);
-    body.set('client_id', this.clientId);
-    body.set('client_secret', this.clientSecret);
-    body.set('response_type', 'code');
-    body.set('grant_type', 'refresh_token');
+                                             console.error(err)
+                                             console.log('Cannot refresh token -> logout...')
+                                             this.logout()
+                                             this.router.navigate([ '/login' ])
 
-    let headers = new Headers();
-    headers.append('Content-Type', 'application/x-www-form-urlencoded');
+                                             return observableThrowError({
+                                               error: this.i18n('You need to reconnect.')
+                                             })
+                                           }),
+                                           share()
+                                         )
 
-    let options = {
-      headers: headers
-    };
+    return this.refreshingTokenObservable
+  }
 
-    return this.http.post(AuthService.BASE_TOKEN_URL, body.toString(), options)
-                    .map(this.restExtractor.extractDataGet)
-                    .map(res => this.handleRefreshToken(res))
-                    .catch((res: Response) => {
-                      // The refresh token is invalid?
-                      if (res.status === 400 && res.json() && res.json().error === 'invalid_grant') {
-                        console.error('Cannot refresh token -> logout...');
-                        this.logout();
-                        this.router.navigate(['/login']);
+  refreshUserInformation () {
+    const obj = {
+      access_token: this.user.getAccessToken(),
+      refresh_token: null,
+      token_type: this.user.getTokenType(),
+      username: this.user.username
+    }
 
-                        return Observable.throw({
-                          json: () => '',
-                          text: () => 'You need to reconnect.'
-                        });
-                      }
+    this.mergeUserInformation(obj)
+        .subscribe(
+          res => {
+            this.user.patch(res)
+            this.user.save()
 
-                      return this.restExtractor.handleError(res);
-                    });
+            this.userInformationLoaded.next(true)
+          }
+        )
   }
 
-  private fetchUserInformations (obj: any) {
-    // Do not call authHttp here to avoid circular dependencies headaches
-
-    const headers = new Headers();
-    headers.set('Authorization', `Bearer ${obj.access_token}`);
+  private mergeUserInformation (obj: UserLoginWithUsername): Observable<UserLoginWithUserInformation> {
+    // User is not loaded yet, set manually auth header
+    const headers = new HttpHeaders().set('Authorization', `${obj.token_type} ${obj.access_token}`)
 
-    return this.http.get(AuthService.BASE_USER_INFORMATIONS_URL, { headers })
-             .map(res => res.json())
-             .map(res => {
-               obj.id = res.id;
-               obj.role = res.role;
-               return obj;
-             }
-    );
+    return this.http.get<UserServerModel>(AuthService.BASE_USER_INFORMATION_URL, { headers })
+               .pipe(map(res => Object.assign(obj, res)))
   }
 
-  private handleLogin (obj: any) {
-    const id = obj.id;
-    const username = obj.username;
-    const role = obj.role;
+  private handleLogin (obj: UserLoginWithUserInformation) {
     const hashTokens = {
-      access_token: obj.access_token,
-      token_type: obj.token_type,
-      refresh_token: obj.refresh_token
-    };
+      accessToken: obj.access_token,
+      tokenType: obj.token_type,
+      refreshToken: obj.refresh_token
+    }
 
-    this.user = new AuthUser({ id, username, role }, hashTokens);
-    this.user.save();
+    this.user = new AuthUser(obj, hashTokens)
+    this.user.save()
 
-    this.setStatus(AuthStatus.LoggedIn);
-  }
+    this.setStatus(AuthStatus.LoggedIn)
+    this.userInformationLoaded.next(true)
 
-  private handleRefreshToken (obj: any) {
-    this.user.refreshTokens(obj.access_token, obj.refresh_token);
-    this.user.save();
+    this.hotkeysService.add(this.hotkeys)
   }
 
-  private setStatus(status: AuthStatus) {
-    this.loginChanged.next(status);
+  private handleRefreshToken (obj: UserRefreshToken) {
+    this.user.refreshTokens(obj.access_token, obj.refresh_token)
+    this.user.save()
   }
 
+  private setStatus (status: AuthStatus) {
+    this.loginChanged.next(status)
+  }
 }