Merge branch 'Test' of Hecc-inc./webssh_plus into master
This commit is contained in:
Gitea
commit
af927a0d0a
67
index.html
67
index.html
@ -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
72
main.js
@ -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
|
||||||
// Creating an HTTP server
|
const shell = pty.spawn('/bin/bash', [], {
|
||||||
var server = http.createServer(app).listen(port);
|
name: 'xterm-color',
|
||||||
console.log(`Listening on port ${port}`);
|
cwd: process.env.PWD,
|
||||||
|
env: process.env
|
||||||
var io = require('socket.io')(server);
|
});
|
||||||
|
// For all shell data send it to the websocket
|
||||||
// When a new socket connects
|
shell.on('data', (data) => {
|
||||||
io.on('connection', function (socket) {
|
ws.send(data);
|
||||||
console.log('Client connect');
|
});
|
||||||
socket.emit('client_identify');
|
// For all websocket data send it to the shell
|
||||||
|
ws.on('message', (msg) => {
|
||||||
socket.on('client_size', function (size) {
|
shell.write(msg);
|
||||||
// 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");
|
|
||||||
});
|
|
||||||
})
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Start the application
|
||||||
|
app.listen(9774);
|
||||||
18
package-lock.json
generated
18
package-lock.json
generated
@ -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",
|
||||||
|
|||||||
@ -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"
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user