Spaces:
Paused
Paused
Upload 5 files
Browse files- Dockerfile +18 -0
- package.json +13 -0
- public/index.html +14 -0
- public/script.js +31 -0
- src/server.js +43 -0
Dockerfile
ADDED
|
@@ -0,0 +1,18 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
# Use Node.js base image
|
| 2 |
+
FROM node:18
|
| 3 |
+
|
| 4 |
+
# Set working directory
|
| 5 |
+
WORKDIR /app
|
| 6 |
+
|
| 7 |
+
# Copy package.json and install dependencies
|
| 8 |
+
COPY package.json .
|
| 9 |
+
RUN npm install
|
| 10 |
+
|
| 11 |
+
# Copy application files
|
| 12 |
+
COPY . .
|
| 13 |
+
|
| 14 |
+
# Expose port 7860
|
| 15 |
+
EXPOSE 7860
|
| 16 |
+
|
| 17 |
+
# Start the application
|
| 18 |
+
CMD ["npm", "start"]
|
package.json
ADDED
|
@@ -0,0 +1,13 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
{
|
| 2 |
+
"name": "web-terminal",
|
| 3 |
+
"version": "1.0.0",
|
| 4 |
+
"description": "Web terminal using WebSocket in Hugging Face Space",
|
| 5 |
+
"main": "src/server.js",
|
| 6 |
+
"scripts": {
|
| 7 |
+
"start": "node src/server.js"
|
| 8 |
+
},
|
| 9 |
+
"dependencies": {
|
| 10 |
+
"ws": "^8.18.0",
|
| 11 |
+
"node-pty": "^1.0.0"
|
| 12 |
+
}
|
| 13 |
+
}
|
public/index.html
ADDED
|
@@ -0,0 +1,14 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
<!DOCTYPE html>
|
| 2 |
+
<html lang="en">
|
| 3 |
+
<head>
|
| 4 |
+
<meta charset="UTF-8">
|
| 5 |
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 6 |
+
<title>Web Terminal</title>
|
| 7 |
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/xterm@4.19.0/css/xterm.css" />
|
| 8 |
+
<script src="https://cdn.jsdelivr.net/npm/xterm@4.19.0/lib/xterm.js"></script>
|
| 9 |
+
</head>
|
| 10 |
+
<body>
|
| 11 |
+
<div id="terminal"></div>
|
| 12 |
+
<script src="/script.js"></script>
|
| 13 |
+
</body>
|
| 14 |
+
</html>
|
public/script.js
ADDED
|
@@ -0,0 +1,31 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
document.addEventListener('DOMContentLoaded', () => {
|
| 2 |
+
const term = new Terminal({
|
| 3 |
+
cursorBlink: true,
|
| 4 |
+
});
|
| 5 |
+
term.open(document.getElementById('terminal'));
|
| 6 |
+
|
| 7 |
+
// Connect to WebSocket server
|
| 8 |
+
const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
|
| 9 |
+
const ws = new WebSocket(`${protocol}//${window.location.host}/`);
|
| 10 |
+
|
| 11 |
+
ws.onopen = () => {
|
| 12 |
+
console.log('Connected to WebSocket server');
|
| 13 |
+
};
|
| 14 |
+
|
| 15 |
+
ws.onmessage = (event) => {
|
| 16 |
+
term.write(event.data);
|
| 17 |
+
};
|
| 18 |
+
|
| 19 |
+
term.onData((data) => {
|
| 20 |
+
ws.send(data);
|
| 21 |
+
});
|
| 22 |
+
|
| 23 |
+
ws.onclose = () => {
|
| 24 |
+
term.write('\r\nConnection closed.\r\n');
|
| 25 |
+
};
|
| 26 |
+
|
| 27 |
+
ws.onerror = (error) => {
|
| 28 |
+
console.error('WebSocket error:', error);
|
| 29 |
+
term.write('\r\nWebSocket error occurred.\r\n');
|
| 30 |
+
};
|
| 31 |
+
});
|
src/server.js
ADDED
|
@@ -0,0 +1,43 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
const WebSocket = require('ws');
|
| 2 |
+
const pty = require('node-pty');
|
| 3 |
+
const http = require('http');
|
| 4 |
+
|
| 5 |
+
const server = http.createServer();
|
| 6 |
+
const wss = new WebSocket.Server({ server });
|
| 7 |
+
|
| 8 |
+
wss.on('connection', (ws) => {
|
| 9 |
+
console.log('New client connected');
|
| 10 |
+
|
| 11 |
+
// Spawn a new shell (bash) for the connection
|
| 12 |
+
const shell = pty.spawn('bash', [], {
|
| 13 |
+
name: 'xterm-color',
|
| 14 |
+
env: process.env,
|
| 15 |
+
});
|
| 16 |
+
|
| 17 |
+
// Relay terminal output to the client
|
| 18 |
+
shell.on('data', (data) => {
|
| 19 |
+
ws.send(data);
|
| 20 |
+
});
|
| 21 |
+
|
| 22 |
+
// Handle input from the client
|
| 23 |
+
ws.on('message', (message) => {
|
| 24 |
+
shell.write(message);
|
| 25 |
+
});
|
| 26 |
+
|
| 27 |
+
// Handle terminal exit
|
| 28 |
+
shell.on('exit', () => {
|
| 29 |
+
ws.close();
|
| 30 |
+
});
|
| 31 |
+
|
| 32 |
+
// Handle WebSocket close
|
| 33 |
+
ws.on('close', () => {
|
| 34 |
+
shell.kill();
|
| 35 |
+
console.log('Client disconnected');
|
| 36 |
+
});
|
| 37 |
+
});
|
| 38 |
+
|
| 39 |
+
// Start the server on port 7860 (required for Hugging Face Spaces)
|
| 40 |
+
const PORT = process.env.PORT || 7860;
|
| 41 |
+
server.listen(PORT, () => {
|
| 42 |
+
console.log(`WebSocket server running on port ${PORT}`);
|
| 43 |
+
});
|