Create term.js

2026-10-18 23:45:52 +08:00 · 2023-01-23 03:45:55 +08:00
parent 67161e62ce
commit d1017ddb5c
1 changed files with 158 additions and 0 deletions
@@ -0,0 +1,158 @@
+function Terms (el, config) {
+  if (typeof config == "undefined") config = {};
+  this.el = el;
+  this.id = config.ssh_info.id || '';
+  this.bws = null; //websocket对象
+  this.route = '/webssh'; // 访问的方法
+  this.term = null; //term对象
+  this.info = null; // 请求数据
+  this.last_body = null;
+  this.fontSize = 15; //终端字体大小
+  this.ssh_info = config.ssh_info;
+  this.run();
+}
+Terms.prototype = {
+  // websocket持久化连接
+  connect: function (callback) {
+      var that = this;
+      // 判断当前websocket连接是否存在
+      if (!this.bws || this.bws.readyState == 3 || this.bws.readyState == 2) {
+          this.bws = new WebSocket((window.location.protocol === 'http:' ? 'ws://' : 'wss://') + window.location.host + this.route);
+          this.bws.addEventListener('message', function (ev) { that.on_message(ev) });
+          this.bws.addEventListener('close', function (ev) { that.on_close(ev) });
+          this.bws.addEventListener('error', function (ev) { that.on_error(ev) });
+          this.bws.addEventListener('open', function (ev) { that.on_open(ev) });
+          if (callback) callback(this.bws)
+      }
+  },
+
+  //连接服务器成功
+  on_open: function (ws_event) {
+      var http_token = $("#request_token_head").attr('token');
+      this.ssh_info['x-http-token'] = http_token;
+
+      this.send(JSON.stringify(this.ssh_info || { 'x-http-token': http_token }))
+      this.term.FitAddon.fit();
+      this.resize({ cols: this.term.cols, rows: this.term.rows });
+  },
+  //服务器消息事件
+  on_message: function (ws_event) {
+      result = ws_event.data;
+      if (!result) return;
+      that = this;
+      if ((result.indexOf("@127.0.0.1:") != -1 || result.indexOf("@localhost:") != -1) && result.indexOf('Authentication failed') != -1) {
+          that.term.write(result);
+          host_trem.localhost_login_form(result);
+          that.close();
+          return;
+      }
+      if (result.length > 1 && that.last_body === false) {
+          that.last_body = true;
+      }
+      that.term.write(result);
+      that.set_term_icon(1);
+      if (result == '\r\n登出\r\n' || result == '登出\r\n' || result == '\r\nlogout\r\n' || result == 'logout\r\n') {
+          that.close();
+          that.bws = null;
+
+      }
+  },
+  //websocket关闭事件
+  on_close: function (ws_event) {
+      this.set_term_icon(0);
+      this.bws = null;
+  },
+
+  /**
+   * @name 设置终端标题状态
+   * @author chudong<2020-08-10>
+   * @param {number} status 终端状态
+   * @return void 
+  */
+  set_term_icon: function (status) {
+      var icon_list = ['icon-warning', 'icon-sucess', 'icon-info'];
+      if (status == 1) {
+          if ($("[data-id='" + this.id + "']").attr("class").indexOf('active') == -1) {
+              status = 2;
+          }
+      }
+      $("[data-id='" + this.id + "']").find('.icon').removeAttr('class').addClass(icon_list[status] + ' icon');
+      if (status == 2) {
+          that = this;
+          setTimeout(function () {
+              $("[data-id='" + that.id + "']").find('.icon').removeAttr('class').addClass(icon_list[1] + ' icon');
+          }, 200);
+      }
+  },
+
+
+  //websocket错误事件
+  on_error: function (ws_event) {
+      if (ws_event.target.readyState === 3) {
+          // var msg = '错误: 无法创建WebSocket连接，请在面板设置页面关闭【开发者模式】';
+          // layer.msg(msg,{time:5000})
+          // if(Term.state === 3) return
+          // Term.term.write(msg)
+          // Term.state = 3;
+      } else {
+          console.log(ws_event)
+      }
+  },
+  //发送数据
+  //@param event 唯一事件名称
+  //@param data 发送的数据
+  //@param callback 服务器返回结果时回调的函数,运行完后将被回收
+  send: function (data, num) {
+      var that = this;
+      //如果没有连接，则尝试连接服务器
+      if (!this.bws || this.bws.readyState == 3 || this.bws.readyState == 2) {
+          this.connect();
+      }
+      //判断当前连接状态,如果!=1，则100ms后尝试重新发送
+      if (this.bws.readyState === 1) {
+          this.bws.send(data);
+      } else {
+          if (this.state === 3) return;
+          if (!num) num = 0;
+          if (num < 5) {
+              num++;
+              setTimeout(function () { that.send(data, num++); }, 100)
+          }
+      }
+  },
+  //关闭连接
+  close: function () {
+      this.bws.close();
+      this.set_term_icon(0);
+  },
+  resize: function (size) {
+      if (this.bws) {
+          size['resize'] = 1;
+          this.send(JSON.stringify(size));
+      }
+
+  },
+  run: function (ssh_info) {
+      var that = this;
+      this.term = new Terminal({ fontSize: this.fontSize, screenKeys: true, useStyle: true });
+      this.term.setOption('cursorBlink', true);
+      this.last_body = false;
+      this.term.open($(this.el)[0]);
+
+      // this.term.FitAddon = new window.FitAddon();
+      // this.term.loadAddon(this.term.FitAddon);
+      // this.term.WebLinksAddon = new WebLinksAddon.WebLinksAddon();
+      // this.term.loadAddon(this.term.WebLinksAddon);
+      if (ssh_info) this.ssh_info = ssh_info;
+      this.connect();
+      that.term.onData(function (data) {
+          try {
+              that.bws.send(data);
+          } catch (e) {
+              that.term.write('\r\n连接丢失,正在尝试重新连接!\r\n');
+              that.connect();
+          }
+      });
+      this.term.focus();
+  }
+}