feat: update the logger and http

package-lock.json

@@ -8320,6 +8320,11 @@
         }
       }
     },
+    "ngx-logger": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/ngx-logger/-/ngx-logger-1.1.2.tgz",
+      "integrity": "sha1-//QiCP9KTHqmIf7z9nOgCHW9Yts="
+    },
     "ngx-perfect-scrollbar": {
       "version": "5.2.0",
       "resolved": "https://registry.npmjs.org/ngx-perfect-scrollbar/-/ngx-perfect-scrollbar-5.2.0.tgz",

package.json

@@ -47,6 +47,7 @@
     "ng2-cookies": "^1.0.12",
     "ngx-bootstrap": "^1.6.6",
     "ngx-layer": "0.0.4",
+    "ngx-logger": "^1.1.2",
     "ngx-perfect-scrollbar": "5.2.0",
     "ngx-progressbar": "^2.1.1",
     "node": "^9.3.0",

src/app/BasicPage/login/login.component.ts

@@ -44,13 +44,13 @@ export class LoginComponent implements OnInit {
     DataStore.error['login'] = '';
     this._logger.log(User);
     if (User.username.length > 0 && User.password.length > 6 && User.password.length < 100) {
-      this._http.post('/api/checklogin', JSON.stringify(User)).map(res => res.json())
+      this._http.check_login(JSON.stringify(User))
         .subscribe(
           data => {
-            User.logined = data.logined;
-            User.name = data.name;
-            User.username = data.username;
-            User.logined = data.logined;
+            User.logined = data['logined'];
+            User.name = data['name'];
+            User.username = data['username'];
+            User.logined = data['logined'];
           },
           err => {
             this._logger.error(err);

src/app/ControlPage/cleftbar/cleftbar.component.ts

@@ -17,9 +17,10 @@ import * as layer from 'layui-layer/src/layer.js';
 import * as UUID from 'uuid-js/lib/uuid.js';
 import {ElementServerMenuComponent} from '../../elements/server-menu/server-menu.component';
 import {NavList, View} from '../control/control.component';
+import {logger} from 'codelyzer/util/logger';
 
 
-export class HostGroup {
+export interface HostGroup {
   name: string;
   id: string;
   children: Array<Host>;
@@ -89,15 +90,13 @@ export class CleftbarComponent implements OnInit {
   }
 
   ngOnInit() {
-    this._http.get('/api/perms/v1/user/my/asset-groups-assets/')
-      .map(res => res.json())
+    this._http.get_my_asset_groups_assets()
       .subscribe(response => {
         this.HostGroups = response;
         this.autologin();
       });
   }
 
-
   autologin() {
     const id = this._appService.getQueryString('id');
     if (id) {
@@ -177,21 +176,6 @@ export class CleftbarComponent implements OnInit {
       NavList.List.push(new View());
       NavList.Active = id;
     }
-    // if (host.platform) {
-    //   if (host.platform.toLowerCase() === 'linux') {
-    //     jQuery('app-ssh').show();
-    //     jQuery('app-rdp').hide();
-    //     this._term.TerminalConnect(host, user.id);
-    //   } else if (host.platform.toLowerCase() === 'windows') {
-    //     jQuery('app-ssh').hide();
-    //     jQuery('app-rdp').show();
-    //     this._rdp.Connect(host, user.id);
-    //   } else {
-    //     jQuery('app-ssh').show();
-    //     jQuery('app-rdp').hide();
-    //     this._term.TerminalConnect(host, user.id);
-    //   }
-    // }
   }
 
   checkPriority(sysUsers) {

src/app/ControlPage/search/search.component.ts

@@ -39,8 +39,7 @@ export class SearchComponent implements OnChanges {
     if (this.searchrequest) {
       this.searchrequest.unsubscribe();
     }
-    this.searchrequest = this._http.get('/api/search?q=' + q)
-      .map(res => res.json())
+    this.searchrequest = this._http.search(q)
       .subscribe(
         data => {
           this._logger.log(data);

src/app/app.module.ts

@@ -12,8 +12,7 @@
 import {BrowserModule} from '@angular/platform-browser';
 import {ClassProvider, NgModule} from '@angular/core';
 import {FormsModule} from '@angular/forms'; // <-- NgModel lives here
-// import {NGXLogger, LoggerConfig, NgxLoggerLevel as LoggerLevel} from 'ngx-logger';
-import {HttpModule} from '@angular/http';
+import {LoggerModule, NGXLogger, NgxLoggerLevel} from 'ngx-logger';
 
 import {AppRoutingModule} from './app-routing.module';
 
@@ -61,9 +60,9 @@ import {HttpClientModule} from '@angular/common/http';
     BrowserModule,
     FormsModule,
     AppRoutingModule,
-    HttpModule,
     NgProgressModule,
-    HttpClientModule
+    HttpClientModule,
+    LoggerModule.forRoot({serverLoggingUrl: '/api/logs', level: NgxLoggerLevel.DEBUG, serverLogLevel: NgxLoggerLevel.ERROR}),
     // NgxLayerModule
   ],
   declarations: [
@@ -104,7 +103,8 @@ import {HttpClientModule} from '@angular/common/http';
     AppService,
     HttpService,
     LogService,
-    LayerService
+    LayerService,
+    NGXLogger
   ]
 })
 export class AppModule {

src/app/app.service.ts

@@ -6,116 +6,126 @@
  * @author   liuzheng <liuzheng712@gmail.com>
  */
 import {Injectable, OnInit} from '@angular/core';
-import {Http, RequestOptionsArgs, Headers} from '@angular/http';
 import {Router} from '@angular/router';
 // import {Cookie} from 'ng2-cookies/ng2-cookies';
 import 'rxjs/add/operator/map';
 import 'rxjs/add/operator/catch';
 import {DataStore, User, Browser} from './globals';
 import {environment} from '../environments/environment';
+import {HttpClient, HttpHeaders} from '@angular/common/http';
+import {NGXLogger} from 'ngx-logger';
+import {HostGroup} from './ControlPage/cleftbar/cleftbar.component';
 
 declare function unescape(s: string): string;
 
 @Injectable()
 export class HttpService {
-  headers = new Headers();
+  headers = new HttpHeaders();
 
-  constructor(private _http: Http) {
+  constructor(private http: HttpClient) {
   }
 
-  // request(url: string | Request, options?: RequestOptionsArgs) {
-  //   if (options == null) {
-  //     options = {};
-  //   }
-  //   options.headers = this.headers;
-  //   return this._http.request(url, options)
-  // }
-
-  get(url: string, options?: RequestOptionsArgs) {
-    if (options == null) {
-      options = {};
+  get(url: string, options?: any) {
+    return this.http.get(url, options);
   }
-    options.headers = this.headers;
-    return this._http.get(url, options);
+
+  post(url: string, options?: any) {
+    return this.http.post(url, options);
   }
 
-  post(url: string, body: any, options?: RequestOptionsArgs) {
-    if (options == null) {
-      options = {};
+  put(url: string, options?: any) {
+    return this.http.put(url, options);
   }
-    options.headers = this.headers;
-    return this._http.post(url, body, options);
+
+  delete(url: string, options?: any) {
+    return this.http.delete(url, options);
   }
 
-  put(url: string, body: any, options?: RequestOptionsArgs) {
-    if (options == null) {
-      options = {};
+  patch(url: string, options?: any) {
+    return this.http.patch(url, options);
   }
-    options.headers = this.headers;
-    return this._http.put(url, body, options);
+
+  head(url: string, options?: any) {
+    return this.http.head(url, options);
   }
 
-  delete(url: string, options?: RequestOptionsArgs) {
-    if (options == null) {
-      options = {};
+  options(url: string, options?: any) {
+    return this.http.options(url, options);
   }
-    options.headers = this.headers;
-    return this._http.delete(url, options);
+
+  report_browser() {
+    return this.http.post('/api/browser', JSON.stringify(Browser));
   }
 
-  patch(url: string, body: any, options?: RequestOptionsArgs) {
-    if (options == null) {
-      options = {};
+  check_login(user: any) {
+    return this.http.post('/api/checklogin', user);
   }
-    options.headers = this.headers;
-    return this._http.patch(url, body, options);
+
+  get_user_profile() {
+    return this.http.get('/api/users/v1/profile/');
   }
 
-  head(url: string, options?: RequestOptionsArgs) {
-    if (options == null) {
-      options = {};
+  get_my_asset_groups_assets() {
+    return this.http.get<Array<HostGroup>>('/api/perms/v1/user/my/asset-groups-assets/');
   }
-    options.headers = this.headers;
-    return this._http.head(url, options);
+
+  get_guacamole_token(username: string, assetID: string, systemUserID: string) {
+    return this.get('/guacamole/api/tokens?username=' + username + '&password=zheng&asset_id=' +
+      assetID + '&system_user_id=' + systemUserID, {headers: new HttpHeaders().set('Content-Type', 'application/x-www-form-urlencoded')});
   }
 
-  options(url: string, options?: RequestOptionsArgs) {
-    if (options == null) {
-      options = {};
+  search(q: string) {
+    return this.http.get('/api/search?q=' + q);
   }
-    options.headers = this.headers;
-    return this._http.options(url, options);
+
+  get_replay(token: string) {
+    return this.http.get('/api/terminal/v1/sessions/' + token + '/replay');
   }
 
 }
 
 @Injectable()
 export class LogService {
-  constructor() {
+  level: number;
+
+  constructor(private _logger: NGXLogger) {
+    // 0.- Level.OFF
+    // 1.- Level.ERROR
+    // 2.- Level.WARN
+    // 3.- Level.INFO
+    // 4.- Level.DEBUG
+    // 5.- Level.LOG
+    this.level = 4;
   }
 
-  trace(message: any, ...additional: any[]) {
-    console.log(message, additional.join(' '));
+  log(message: any, ...additional: any[]) {
+    if (this.level > 4) {
+      this._logger.log(message, ...additional);
+    }
   }
 
   debug(message: any, ...additional: any[]) {
-    console.log(message, additional.join(' '));
+    if (this.level > 3) {
+      this._logger.debug(message, ...additional);
+    }
   }
 
   info(message: any, ...additional: any[]) {
-    console.log(message, additional.join(' '));
+    if (this.level > 2) {
+      this._logger.info(message, ...additional);
     }
-
-  log(message: any, ...additional: any[]) {
-    console.log(message, additional.join(' '));
   }
 
   warn(message: any, ...additional: any[]) {
-    console.log(message, additional.join(' '));
+    if (this.level > 1) {
+      this._logger.warn(message, ...additional);
+    }
   }
 
   error(message: any, ...additional: any[]) {
-    console.log(message, additional.join(' '));
+    if (this.level > 0) {
+      this._logger.error(message, ...additional);
+    }
   }
 
 }
@@ -149,6 +159,8 @@ export class AppService implements OnInit {
     if (environment.production) {
       this.checklogin();
     }
+    // this._logger
+    //   .debug(this._http.get_user_profile());
   }
 
   ngOnInit() {
@@ -168,23 +180,22 @@ export class AppService implements OnInit {
           // jQuery('angular2').show();
         } else {
           // this.browser();
-          this._http.get('/api/users/v1/profile/')
-            .map(res => res.json())
+          this._http.get_user_profile()
             .subscribe(
               data => {
-                User.id = data.id;
-                User.name = data.name;
-                User.username = data.username;
-                User.email = data.email;
-                User.is_active = data.is_active;
-                User.is_superuser = data.is_superuser;
-                User.role = data.role;
-                // User.groups = data.groups;
-                User.wechat = data.wechat;
-                User.comment = data.comment;
-                User.date_expired = data.date_expired;
-                User.phone = data.phone.toString();
-                User.logined = data.logined;
+                User.id = data['id'];
+                User.name = data['name'];
+                User.username = data['username'];
+                User.email = data['email'];
+                User.is_active = data['is_active'];
+                User.is_superuser = data['is_superuser'];
+                User.role = data['role'];
+                // User.groups = data['groups'];
+                User.wechat = data['wechat'];
+                User.comment = data['comment'];
+                User.date_expired = data['date_expired'];
+                User.phone = data['phone'].toString();
+                User.logined = data['logined'];
                 this._logger.debug(User);
               },
               err => {
@@ -215,7 +226,7 @@ export class AppService implements OnInit {
   }
 
   browser() {
-    this._http.post('/api/browser', JSON.stringify(Browser)).map(res => res.json()).subscribe();
+    this._http.report_browser();
   }
 
   getQueryString(name) {

src/app/elements/iframe/iframe.component.ts

@@ -24,10 +24,7 @@ export class ElementIframeComponent implements OnInit {
 
   ngOnInit() {
     // /guacamole/api/tokens will redirect to http://guacamole/api/tokens
-    this._http.headers.set('Content-Type', 'application/x-www-form-urlencoded');
-    this._http.get('/guacamole/api/tokens?username=' + User.name + '&password=zheng&asset_id=' +
-      this.host.id + '&system_user_id=' + this.userid)
-      .subscribe(
+    this._http.get_guacamole_token(User.name, this.host.id, this.userid).subscribe(
       data => {
         const title = this.host.hostname + '[' + this.host.ip + ']';
         const base = Base64.encode(title + '\0' + 'c' + '\0' + 'jumpserver');

src/app/replay-page/replay-page.component.ts

@@ -24,8 +24,7 @@ export class ReplayPageComponent implements OnInit {
     this.activatedRoute.params.subscribe((params: Params) => {
       token = params['token'];
     });
-    this._http.get('/api/terminal/v1/sessions/' + token + '/replay')
-      .map(res => res.json())
+    this._http.get_replay(token)
       .subscribe(
         data => {
           Video.type = 'json';