Compare commits

...

3 Commits

Author SHA1 Message Date
af927a0d0a Merge branch 'Test' of Hecc-inc./webssh_plus into master 2019-09-03 16:33:00 +02:00
BuildTools
7a4b5ecc5e It works now :D 2019-09-03 16:31:37 +02:00
8d90f32921 Try #2 2019-09-03 16:15:30 +02:00
4 changed files with 67 additions and 91 deletions

View File

@ -4,51 +4,34 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge"> <meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>webssh_plus</title> <title>bash</title>
<script src="/socket.io/socket.io.js"></script> <link rel="stylesheet" href="/node_modules/xterm/dist/xterm.css" />
<link rel="stylesheet" href="node_modules/xterm/dist/xterm.css" /> <link rel="stylesheet" href="/node_modules/xterm/dist/addons/fullscreen/fullscreen.css" />
<script src="node_modules/xterm/dist/xterm.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/es6-promise/4.1.1/es6-promise.auto.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/fetch/1.0.0/fetch.min.js"></script>
<style> <script src="/node_modules/xterm/dist/xterm.js"></script>
body { <script src="/node_modules/xterm/dist/addons/fit/fit.js"></script>
height: 100vh!important; <script src="/node_modules/xterm/dist/addons/attach/attach.js"></script>
margin: 0;
padding: 0;
}
div#terminal {
height: 100%;
width: 100%;
}
</style>
</head> </head>
<body> <body>
<div id="terminal"> <div id="terminal"></div>
<!-- ! Here will be the terminal stuff -->
</div>
<script> <script>
var term = new Terminal(); // No idea what these are about. Just copied them from the demo code
Terminal.applyAddon(attach);
// Connect to the socket.io server Terminal.applyAddon(fit);
var socket = io.connect('http://localhost:9774'); // The terminal
// Wait for data from the server const term = new Terminal();
socket.on('client_identify', function() { // This kinda makes sense
var size = { const container = document.getElementById('terminal');
height: document.querySelector('body').offsetHeight, term.open(container);
width: document.querySelector('body').offsetWidth, // Open the websocket connection to the backend
} const protocol = (location.protocol === 'https:') ? 'wss://' : 'ws://';
socket.emit('client_size', size) const port = location.port ? `:${location.port}` : '';
}); const socketUrl = `${protocol}${location.hostname}${port}/shell`;
const socket = new WebSocket(socketUrl);
term.open(document.getElementById('terminal')) // Attach the socket to the terminal
socket.onopen = (ev) => { term.attach(socket); };
socket.on('output', function (data) { // Not going to worry about close/error for the websocket
term.write(data);
});
// Listen for user input and pass it to the server
term.on('data', function(data) {
console.log(data);
socket.emit('input', data);
});
</script> </script>
</body> </body>
</html> </html>

72
main.js
View File

@ -1,55 +1,29 @@
// Reference: https://hub.packtpub.com/making-simple-web-based-ssh-client-using-nodejs-and-socketio/
var express = require('express'); var express = require('express');
var https = require('https');
var http = require('http');
var fs = require('fs');
var pty = require('node-pty'); var pty = require('node-pty');
// Set port const app = express();
var port = 9774; const expressWs = require('express-ws')(app);
// Set up express server // Serve static assets from ./static
let app = express(); app.use(express.static('./'));
// Set HTTP server root folder // Instantiate shell and set up data handlers
app.use("/", express.static("./")); expressWs.app.ws('/shell', (ws, req) => {
// Spawn the shell
const shell = pty.spawn('/bin/bash', [], {
name: 'xterm-color',
cwd: process.env.PWD,
env: process.env
});
// For all shell data send it to the websocket
shell.on('data', (data) => {
ws.send(data);
});
// For all websocket data send it to the shell
ws.on('message', (msg) => {
shell.write(msg);
});
});
// Creating an HTTP server // Start the application
var server = http.createServer(app).listen(port); app.listen(9774);
console.log(`Listening on port ${port}`);
var io = require('socket.io')(server);
// When a new socket connects
io.on('connection', function (socket) {
console.log('Client connect');
socket.emit('client_identify');
socket.on('client_size', function (size) {
// Create terminal
console.log(size);
console.log({ cols: Math.floor(size.width / 9), rows: Math.floor(size.height / 10) })
var term = pty.spawn('sh', [], {
name: 'xterm-color',
cols: Math.floor(size.width / 9),
rows: Math.floor(size.height / 10),
cwd: process.env.HOME,
env: process.env
});
// Listen on the terminal for output and send it to the client
term.on('data', function (data) {
socket.emit('output', data);
});
// Listen on the client and send any input to the terminal
socket.on('input', function (data) {
term.write(data);
});
// When socket disconnects, destroy the terminal
socket.on("disconnect", function () {
term.destroy();
console.log("Client disconnect");
});
})
});

18
package-lock.json generated
View File

@ -269,6 +269,24 @@
"vary": "~1.1.2" "vary": "~1.1.2"
} }
}, },
"express-ws": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/express-ws/-/express-ws-4.0.0.tgz",
"integrity": "sha512-KEyUw8AwRET2iFjFsI1EJQrJ/fHeGiJtgpYgEWG3yDv4l/To/m3a2GaYfeGyB3lsWdvbesjF5XCMx+SVBgAAYw==",
"requires": {
"ws": "^5.2.0"
},
"dependencies": {
"ws": {
"version": "5.2.2",
"resolved": "https://registry.npmjs.org/ws/-/ws-5.2.2.tgz",
"integrity": "sha512-jaHFD6PFv6UgoIVda6qZllptQsMlDEJkTQcybzzXDYM1XO9Y8em691FGMPmM46WGyLU4z9KMgQN+qrux/nhlHA==",
"requires": {
"async-limiter": "~1.0.0"
}
}
}
},
"finalhandler": { "finalhandler": {
"version": "1.1.2", "version": "1.1.2",
"resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.2.tgz", "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.2.tgz",

View File

@ -18,6 +18,7 @@
"license": "UNLICENSED", "license": "UNLICENSED",
"dependencies": { "dependencies": {
"express": "^4.17.1", "express": "^4.17.1",
"express-ws": "^4.0.0",
"node-pty": "^0.8.1", "node-pty": "^0.8.1",
"socket.io": "^2.2.0", "socket.io": "^2.2.0",
"xterm": "^3.14.5" "xterm": "^3.14.5"