[Update] 修改支持guacamole闲时超时

proxy.conf.json

@@ -13,7 +13,7 @@
     "secure": false
   },
   "/guacamole/": {
-    "target": "http://127.0.0.1:8083",
+    "target": "http://127.0.0.1:8081",
     "secure": false,
     "ws": true,
     "pathRewrite": {

src/app/elements/guacamole/guacamole.component.html

 <div class="rdpIframe">
   <iframe #rdpRef *ngIf="target" [src]="trust(target)" width="100%" height="100%" (mouseenter)="active()"></iframe>
+  <div *ngIf="isIdleTimeout" class="idleTimeout">
+    {{ idleTimeoutMsg | trans }}
+  </div>
 </div>

src/app/elements/guacamole/guacamole.component.scss

@@ -6,3 +6,9 @@ iframe {
 .rdpIframe {
  height: 100%;
 }
+
+.idleTimeout {
+  padding: 50px;
+  color: red;
+  font-size: 30px;
+}

src/app/elements/guacamole/guacamole.component.ts

 import {Component, ElementRef, Input, OnInit, ViewChild} from '@angular/core';
 import {CookieService} from 'ngx-cookie-service';
-import {HttpService, LogService} from '@app/services';
+import {HttpService, LogService, SettingService} from '@app/services';
 import {DataStore, User} from '@app/globals';
 import {DomSanitizer} from '@angular/platform-browser';
 import {View} from '@app/model';
@@ -19,16 +19,22 @@ export class ElementGuacamoleComponent implements OnInit {
   @Input() index: number;
   @ViewChild('rdpRef') el: ElementRef;
   registered = false;
+  iframeWindow: any;
+  idleTimeout: number;
+  idleTTL = 1000 * 3600;
+  isIdleTimeout = false;
+  idleTimeoutMsg = 'Idle timeout, connection has been disconnected';
 
   constructor(private sanitizer: DomSanitizer,
               private _http: HttpService,
               private _cookie: CookieService,
+              private settingSvc: SettingService,
               private _logger: LogService) {
+    this.idleTTL = this.settingSvc.globalSetting.SECURITY_MAX_IDLE_TIME * 60 * 1000;
   }
 
   registerHost() {
     let action: any;
-    console.log(this.sysUser);
     if (this.remoteAppId) {
       action = this._http.guacamoleAddRemoteApp(User.id, this.remoteAppId, this.sysUser.id, this.sysUser.username, this.sysUser.password);
     } else {
@@ -38,6 +44,7 @@ export class ElementGuacamoleComponent implements OnInit {
       data => {
         const base = data.result;
         this.target = document.location.origin + '/guacamole/#/client/' + base + '?token=' + DataStore.guacamoleToken;
+        setTimeout(() => this.setIdleTimeout(), 500);
       },
       error => {
         if (!this.registered) {
@@ -73,15 +80,31 @@ export class ElementGuacamoleComponent implements OnInit {
     if (this.target) {
       return null;
     }
-
-    // if (!environment.production) {
-    //   this.target = this._cookie.get('guacamole');
-    //   NavList.List[this.index].Rdp = this.el.nativeElement;
-    //   return null;
-    // }
     this.registerHost();
   }
 
+  setIdleTimeout() {
+    this.iframeWindow = this.el.nativeElement.contentWindow;
+    this.resetIdleTimeout();
+    this.iframeWindow.onclick = () => this.resetIdleTimeout();
+    this.iframeWindow.onkeyup = () => this.resetIdleTimeout();
+    console.log(this.iframeWindow);
+  }
+
+  resetIdleTimeout() {
+    if (this.idleTimeout) {
+      clearTimeout(this.idleTimeout);
+      this.idleTimeout = null;
+    }
+    this.idleTimeout = setTimeout(() => this.disconnect(), this.idleTTL);
+  }
+
+  disconnect() {
+    this._logger.debug('Disconnect guacamole');
+    this.target = '';
+    this.isIdleTimeout = true;
+  }
+
   trust(url) {
     return this.sanitizer.bypassSecurityTrustResourceUrl(url);
   }

src/app/model.ts

@@ -188,6 +188,7 @@ export class Monitor {
 
 export class GlobalSetting {
   WINDOWS_SKIP_ALL_MANUAL_PASSWORD: boolean;
+  SECURITY_MAX_IDLE_TIME: number;
 }
 
 export class Setting {

src/assets/i18n/zh.json

@@ -79,5 +79,6 @@
   "rows": "行数",
   "favorite": "收藏",
   "disfavor": "取消收藏",
-  "success": "成功"
+  "success": "成功",
+  "idle timeout, connection has been disconnected": "空闲超时，链接已断开"
 }