Using node.js developers webSocket development agency, can solve the problem webSocket of cross-domain cookies.
Then someone will say, if a virtual desktop traffic openstack is too large, the agency rushed out of memory, and how to deal with?
In fact, not what people need special handling virtual desktop virtual or physical machine with WEB, unless the system is windows, linux system can log in with the flow of smaller virtual terminal. After actually entering linux virtual desktop, but also with a lot of terminal operation is not it?
The operational level, it is recommended to use linux-based virtual desktop user terminal, or even does not provide a virtual desktop, this is the method to solve the traffic congestion.
However you want to manipulate the linux terminal on the web, you need to call via SSH proxy mode and return to a shell of virtual terminal (pty) open source Web Terminal project.
Here the project in order to prevent SSH coupling agent, resulting in code that is difficult to find, or Java middleware implemented node.js of Springboot.
node.js server-side realization (node.js have solutions for websocket service side of the two: native websocket package and socket.io, which can be converted to sockJS link in case the browser does not support):
var http = require('http'); var io = require('socket.io'); var utf8 = require('utf8'); var SSHClient = require('ssh2').Client; var server2 = http.createServer(function(request, response) { console.log((new Date()) + ' Server is reseiveing on port 4041'); response.writeHead(204); response.end(); }); server2.listen(4041, function() { console.log((new Date()) + ' Server is listening on port 4041'); }); I= io.listen(server2,{origins: '*:*'}); function createNewServer(machineConfig, socket) { var ssh = new SSHClient(); let {msgId, ip, username, password, port, rows, cols} = machineConfig; ssh.on('ready', function () { socket.emit(msgId, '\r\n***' + ip + ' SSH CONNECTION ESTABLISHED ***\r\n'); ssh.shell(function(err, stream) { if(rows != null && cols != null) stream.setWindow(rows, cols); if(err) { return socket.emit(msgId, '\r\n*** SSH SHELL ERROR: ' + err.message + ' ***\r\n'); } socket.on(msgId, function (data) { var mydata = data.data; if(mydata != null){ console.log(">>>" + data.data + "<<<"); stream.write(mydata); } var size = data.rows; if(size != null){ stream.setWindow(data.rows, data.cols); } }); stream.on('data', function (d) { try{ var mydata = utf8.decode(d.toString('binary')); mydata = mydata.replace(/ \r(?!\n)/g,''); console.log("<<<" + mydata + ">>>"); socket.emit(msgId, mydata); }catch(err){ socket.emit(msgId, '\r\n*** SSH CONNECTION ERROR: ' + err.message + ' ***\r\n'); } }).on('close', function () { ssh.end(); }); }) }).on('close', function () { socket.emit(msgId, '\r\n*** SSH CONNECTION CLOSED ***\r\n'); ssh.end(); }).on('error', function (err) { console.log(err); socket.emit(msgId, '\r\n*** SSH CONNECTION ERROR: ' + err.message + ' ***\r\n'); ssh.end(); }).connect({ host: ip, port: port, username: username, password: password }); } io.on('connection', function(socket) { socket.on('createNewServer', function(machineConfig) {//新建一个ssh连接 console.log("createNewServer"); createNewServer(machineConfig, socket); }) socket.on('disconnect', function(){ console.log('user disconnected'); }); })
Vue.js write the code (for an introduction xterm):
<template> </template> <script> import 'xterm/dist/xterm.css' import { Terminal } from 'xterm'; import * as fit from 'xterm/dist/addons/fit/fit'; import * as fullscreen from 'xterm/dist/addons/fullscreen/fullscreen' import openSocket from 'socket.io-client'; export default { name: ''sshweb, props:['ip','port'], data () { return { wsServer:null, localip:'', localport:'', env: "", podName: "", contaName: "", logtxt: "", term:[0,0], colsLen:9, rowsLen:19, colRemain:21, msgId:0, col:80, row:24, terminal: { pid: 1, name: 'terminal', cols: 80, rows: 24 }, } }, watch:{ port(val){ this.localport=port; }, ip(val){ this.localip=ip; } }, methods: { S4() { return (((1+Math.random())*0x10000)|0).toString(16).substring(1); }, guid() { return (this.S4()+this.S4()+"-"+this.S4()+"-"+this.S4()+"-"+this.S4()+"-"+this.S4()+this.S4()+this.S4()); }, createServer1(){ this.msgId = this.guid(); var msgId = this.msgId; var myserver = this.wsServer; var selfy = this; var ipport = this.$route.params.ipport.split(':'); var myport = ipport[0]; var myip = ipport[1]; myserver.emit("createNewServer", {msgId: msgId, ip: myport, username: "root", password: "xunfang", port: myip, rows: this.term[0].rows, cols: this.term[0].cols}); let term = this.term[0]; term.on("data", function(data) { myserver.emit(msgId, {'data':data}); }); myserver.on(msgId, function (data) { term.write(data); }); term.attachCustomKeyEventHandler(function(ev) { if (ev.keyCode == 86 && ev.ctrlKey) { myserver.emit(msgId, new TextEncoder().encode("\x00" + this.copy)); } }); myserver.on('connect_error', function(data){ console.log(data + ' - connect_error'); }); myserver.on('connect_timeout', function(data){ console.log(data + ' - connect_timeout'); }); myserver.on('error', function(data){ console.log(data + ' - error'); }); myserver.on('disconnect', function(data){ console.log(data + ' - disconnect'); }); myserver.on('reconnect', function(data){ console.log(data + ' - reconnect'); }); myserver.on('reconnect_attempt', function(data){ console.log(data + ' - reconnect_attempt'); }); myserver.on('reconnecting', function(data){ console.log(data + ' - reconnecting'); }); myserver.on('reconnect_error', function(data){ console.log(data + ' - reconnect_error'); }); myserver.on('reconnect_failed', function(data){ console.log(data + ' - reconnect_failed'); }); myserver.on('ping', function(data){ console.log(data + ' - ping'); }); myserver.on('pong', function(data){ console.log(data + ' - pong'); }); }, resize(row,col){ row = Math.floor(row/this.rowsLen); col = Math.floor((col-this.colRemain)/this.colsLen); if(row<24)row=24; if(col<80)col=80; if(this.row != row || this.col != col){ this.row=row; this.col=col; this.term[0].fit(); //this.term[0].resize(col,row); this.wsServer.emit(this.msgId, {'rows':this.term[0].rows.toString(),'cols':this.term[0].cols.toString()}); //this.wsServer.emit(this.msgId, {'rows':row.toString(),'cols':col.toString()}); } } }, mounted(){ this.wsServer = new openSocket('ws://127.0.0.1:4041'); var selfy = this; window.onload = function(){ for(var i = 0;i < 1;i++){ var idname = 'net0'; Terminal.applyAddon(fit); Terminal.applyAddon(fullscreen); var terminalContainer = document.getElementById('app'); //terminalContainer.style.height = (selfy.rowsLen * selfy.terminal.rows).toString() + 'px' ; //terminalContainer.style.width = (selfy.colsLen * selfy.terminal.cols + selfy.colRemain).toString() + 'px' ; selfy.term[i] = new Terminal({ cursorBlink: true }); selfy.term[i].open(terminalContainer, true); if(window.innerWidth > 0 && window.innerHeight > 0) selfy.term[i].fit(); selfy.createServer1(); } } $(window).resize(() =>{ if(window.innerWidth > 0 && window.innerHeight > 0){ selfy.resize(window.innerHeight, window.innerWidth); } }); }, components: { } } </script> <style scoped> #app{height:100%;width:100%;} </style>
Vue and open server systems, landing on the client SSH, you're done!
Java components:
Here is a complete solution , I had to correct github warehouse.
Download the project, open Springboot, in the browser to http: // localhost: 10003 /, will enter the login page does not currently support RSA key login, only supports login account password.
Two projects SSH window is full-screen, as long as the window is not less than a certain size, the window with the word window will zoom to adjust the position.