ChK/appRobotControlScara
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

WS statt Telnet

Browse Source
This commit is contained in:
chk
2026-03-09 20:15:18 +01:00
parent 9480f40233
commit f2a675a652
8 changed files with 221 additions and 327 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
.gitignore vendored
View File

@@ -43,6 +43,9 @@ build/Release
node_modules/
jspm_packages/
# SSH keys
*.pem
# Snowpack dependency directory (https://snowpack.dev/)
web_modules/

88
network/TelnetConnection.js
View File

@@ -1,88 +0,0 @@
const net = require("net");
class TelnetConnection {
constructor(config){
this.host = config.host;
this.port = config.port;
this.reconnectDelay = config.reconnectDelay || 30000;
this.socket = null;
this.dataListeners = [];
this.connectionListeners = [];
this.connect();
}
connect(){
console.log("Connecting to FluidNC:", this.host);
this.socket = net.createConnection({
host: this.host,
port: this.port
});
this.socket.on("connect",()=>{
console.log("FluidNC connected");
this.connectionListeners.forEach(fn=>fn(true));
});
this.socket.on("data",(data)=>{
const msg = data.toString();
this.dataListeners.forEach(fn=>fn(msg));
});
this.socket.on("close",()=>{
console.log("FluidNC disconnected");
this.connectionListeners.forEach(fn=>fn(false));
setTimeout(()=>{
this.connect();
}, this.reconnectDelay);
});
this.socket.on("error",(err)=>{
console.log("Telnet error:",err.message);
});
}
send(cmd){
if(!this.socket) return;
this.socket.write(cmd+"\n");
}
realtime(cmd){
if(!this.socket) return;
this.socket.write(cmd);
}
onData(fn){
this.dataListeners.push(fn);
}
onConnection(fn){
this.connectionListeners.push(fn);
}
}
module.exports = TelnetConnection;

14
package-lock.json generated
View File

@@ -7,9 +7,11 @@
"": {
"name": "fluidnc-webcontrol",
"version": "1.0.0",
"license": "ISC",
"dependencies": {
"express": "^4.18.2",
"ws": "^8.16.0"
"express": "^4.22.1",
"telnet-stream": "^1.1.0",
"ws": "^8.19.0"
}
},
"node_modules/accepts": {
@@ -214,6 +216,7 @@
"version": "4.22.1",
"resolved": "https://registry.npmjs.org/express/-/express-4.22.1.tgz",
"integrity": "sha512-F2X8g9P1X7uCPZMA3MVf9wcTqlyNp7IhH5qPCI0izhaOIYXaW9L535tGA3qmjRzpH+bZczqq7hVKxTR4NWnu+g==",
"license": "MIT",
"dependencies": {
"accepts": "~1.3.8",
"array-flatten": "1.1.1",
@@ -712,6 +715,12 @@
"node": ">= 0.8"
}
},
"node_modules/telnet-stream": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/telnet-stream/-/telnet-stream-1.1.0.tgz",
"integrity": "sha512-saVuav/ScOFlrQXSB8xUqwwIi3sifjSfBiiywGMu7B8wJz60duqFCyG8IhcRjoPpl6VGGkBH+yH3Tnbxh36h1Q==",
"license": "AGPL-3.0"
},
"node_modules/toidentifier": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.1.tgz",
@@ -760,6 +769,7 @@
"version": "8.19.0",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.19.0.tgz",
"integrity": "sha512-blAT2mjOEIi0ZzruJfIhb3nps74PRWTCz1IjglWEEpQl5XS/UNama6u2/rjFkDDouqr4L67ry+1aGIALViWjDg==",
"license": "MIT",
"engines": {
"node": ">=10.0.0"
},

16
package.json
View File

@@ -6,7 +6,17 @@
"start": "node server/server.js"
},
"dependencies": {
"express": "^4.18.2",
"ws": "^8.16.0"
}
"express": "^4.22.1",
"telnet-stream": "^1.1.0",
"ws": "^8.19.0"
},
"description": "WebPage to show X-Z-Options. The FluidNC is connected to this app.",
"repository": {
"type": "git",
"url": "http://thinkcentre.local:3000/ChK/appRobotControlScara.git"
},
"keywords": [],
"author": "",
"license": "ISC",
"type": "commonjs"
}

4
server/config/config.js
View File

@@ -1,8 +1,8 @@
module.exports = {
fluidnc: {
host: "fluidncsilver.local",
port: 81,
host: "fluidncred.local",
port: 80,
reconnectDelay: 30000
},

125
server/fluidnc/FluidNCClient.js
View File

@@ -1,104 +1,69 @@
const WebSocket = require("ws");
const EventEmitter = require("events");
const config = require("../config/config");
const net = require("net");
const { resolve } = require("path");
const TelnetSocket = require("telnet-stream");
class FluidNCClient extends EventEmitter {
constructor(cfg) {
super();
this.host = cfg.host;
this.port = cfg.port || 81;
this.ws = null;
this.reconnectDelay = 2000;
class FluidNCClient {
constructor() {
console.log("[FluidNCClient] Initializing...");
this.url = config.fluidnc.host;
this.port = config.fluidnc.port || 23;
this.tSocket = null;
this.connected = false;
this.state = { x:0, z:0, state:"unknown" };
this.listeners = [];
this._connect();
this.connect();
}
_connect() {
console.log(`[FluidNCClient] Connecting to FluidNC: ${this.url}`);
connect() {
const url = `ws://${this.host}:${this.port}`;
console.log("[FluidNC] Connecting to:", url);
let socket = null;
this.ws = new WebSocket(url);
new Promise((resolve, reject) => {
socket = net.createConnection({host:this.url, port:this.port}, () => {
resolve(socket);
}).on("error", reject);
}).then(connection => {
console.log("[FluidNCClient] Telnet socket connected");
this.connected = true;
connection.on("data", data => {
const msg = data.toString().replace(/\r/g,"").trim();
if(!msg) return;
console.log("[FluidNCClient] Received:", msg);
if(msg.startsWith("<") && msg.includes("MPos:")){
const match = msg.match(/MPos:([\d\.\-]+),[\d\.\-]+,([\d\.\-]+)/);
if(match){
this.state.x = parseFloat(match[1]);
this.state.z = parseFloat(match[2]);
this.state.state = msg.split(",")[0].replace("<","");
this._broadcast(this.state);
}
}
this.ws.on("open", () => {
console.log("[FluidNC] Connected (WS)");
});
if(socket != null){
this.tSocket = TelnetSocket(socket);
this.ws.on("message", (msg) => {
this.emit("message", msg.toString());
});
this.tSocket.on("close", () => {
console.log("[FluidNCClient] Telnet Closed");
this.tSocket = null;
this.connected = false;
setTimeout(()=>this._connect(), 30000);
this.ws.on("close", () => {
console.log("[FluidNC] Disconnected → retry");
setTimeout(() => this.connect(), this.reconnectDelay);
});
this.ws.on("error", (err) => {
console.log("[FluidNC] WS Error:", err.message);
});
}
}, error => {
console.log("[FluidNCClient] Telnet Connection Error:", error.toString());
this.tSocket = null;
this.connected = false;
setTimeout(()=>this._connect(), 30000);
});
}
_broadcast(msg){
this.listeners.forEach(fn => fn(msg));
}
onMessage(fn){
this.listeners.push(fn);
}
send(cmd){
if(this.tSocket){
console.log("[FluidNCClient] Sending:", cmd);
this.tSocket.write(cmd + "\r\n");
// --- BASIC COMMANDS ---
sendLine(cmd) {
if (this.ws && this.ws.readyState === WebSocket.OPEN) {
this.ws.send(cmd + "\n");
}
}
jog(axis, value){
if(!this.connected) return;
this.send("G91");
this.send(`G0 ${axis.toUpperCase()}${value}`);
this.send("G90");
requestStatus() {
this.sendLine("?");
}
sendGcode(cmd){
if(!this.connected) return;
this.send("G90");
this.send(cmd);
jog(axis, value) {
const cmd = `$J=G91 ${axis}${value} F2000`;
this.sendLine(cmd);
}
setZero(){
if(!this.connected) return;
this.send("G10 L20 P1 X0 Z0");
sendGcode(cmd) {
this.sendLine(cmd);
}
setZero() {
this.sendLine("G92 X0 Y0 Z0");
}
onMessage(fn) {
this.on("message", fn);
}
}

90
server/server.js
View File

@@ -9,88 +9,72 @@ const FluidNCClient = require("./fluidnc/FluidNCClient");
const app = express();
app.use(express.static(path.join(__dirname,"../web")));
// Serve frontend
app.use(express.static(path.join(__dirname, "../web")));
const server = https.createServer({
key: fs.readFileSync(path.join(__dirname,"../cert/key.pem")),
cert: fs.readFileSync(path.join(__dirname,"../cert/cert.pem"))
},app);
// HTTPS server
const server = https.createServer(
{
key: fs.readFileSync(path.join(__dirname, "../cert/key.pem")),
cert: fs.readFileSync(path.join(__dirname, "../cert/cert.pem"))
},
app);
const wss = new WebSocket.Server({server});
// Websocket server (browser connections)
const wss = new WebSocket.Server({ server });
const fluid = new FluidNCClient();
// Create FluidNC WebSocket client
const fluid = new FluidNCClient(config.fluidnc);
// Connected browser clients
let clients = [];
wss.on("connection",(ws)=>{
console.log("[WS] Client connected");
wss.on("connection", (ws) => {
console.log("[WS] Browser connected");
clients.push(ws);
ws.on("message",(msg)=>{
try{
ws.on("message", (msg) => {
try {
const data = JSON.parse(msg);
console.log("[WS] Received message:", data);
if(data.type==="jog"){
fluid.jog(data.axis,data.value);
if (data.type === "jog") {
fluid.jog(data.axis, data.value);
}
if(data.type==="gcode"){
if (data.type === "gcode") {
fluid.sendGcode(data.cmd);
}
if(data.type==="zero"){
if (data.type === "zero") {
fluid.setZero();
}
}catch(e){
console.log("[WS] Error parsing message:", e);
} catch (e) {
console.log("[WS] Error parsing:", e);
}
});
ws.on("close",()=>{
clients = clients.filter(c=>c!==ws);
console.log("[WS] Client disconnected");
ws.on("close", () => {
clients = clients.filter(c => c !== ws);
console.log("[WS] Browser disconnected");
});
});
fluid.onMessage((msg)=>{
const json = JSON.stringify(msg);
clients.forEach(c=>{
if(c.readyState===WebSocket.OPEN){
c.send(json);
// FluidNC → Browser broadcasting
fluid.onMessage((msg) => {
clients.forEach(c => {
if (c.readyState === WebSocket.OPEN) {
c.send(msg.toString());
}
});
});
server.listen(config.server.port,()=>{
// Status polling ("?" every 200ms)
setInterval(() => {
fluid.requestStatus();
}, 200);
server.listen(config.server.port, () => {
console.log("[Server] Running at:");
console.log(`https://localhost:${config.server.port}`);
});

204
web/index.html
View File

@@ -1,132 +1,142 @@
<!DOCTYPE html>
<html>
<html lang="de">
<head>
<meta charset="UTF-8" />
<title>SCARA Robot Control</title>
<style>
body {
background: #202020;
color: #e0e0e0;
font-family: Arial, sans-serif;
text-align: center;
}
<meta charset="UTF-8">
<title>FluidNC Control</title>
h1 {
margin-top: 20px;
}
<style>
#posBox {
margin: 20px auto;
width: 300px;
padding: 15px;
background: #333;
border-radius: 10px;
font-size: 20px;
}
body{
font-family:Arial;
margin:40px;
}
.btnGrid {
display: grid;
grid-template-columns: repeat(3, 120px);
gap: 10px;
justify-content: center;
margin-top: 30px;
}
button{
width:60px;
height:40px;
margin:3px;
}
.axis{
margin-bottom:30px;
}
.status{
font-size:20px;
margin-bottom:20px;
}
</style>
button {
background: #444;
border: none;
padding: 15px;
font-size: 18px;
color: white;
border-radius: 8px;
cursor: pointer;
}
button:hover {
background: #666;
}
</style>
</head>
<body>
<h2 id="connection">Trying to connect to FluidNC...</h2>
<h1>SCARA Robot Control</h1>
<div class="axis">
<div id="posBox">
<div>X: <span id="posX">0.000</span></div>
<div>Z: <span id="posZ">0.000</span></div>
</div>
<h3>X Axis</h3>
<h2>Jog Controls</h2>
<button onclick="jog('x',-10)">-10</button>
<button onclick="jog('x',-1)">-1</button>
<div class="btnGrid">
<button onclick="jog('X', -10)">X -10</button>
<button></button>
<button onclick="jog('X', 10)">X +10</button>
<span id="x">0</span>
<button onclick="jog('Z', 10)">Z +10</button>
<button></button>
<button onclick="jog('Z', -10)">Z -10</button>
</div>
<button onclick="jog('x',1)">+1</button>
<button onclick="jog('x',10)">+10</button>
<script>
let ws;
</div>
function connectWS() {
ws = new WebSocket("wss://" + window.location.hostname + ":3000");
<div class="axis">
ws.onopen = () => {
console.log("WS connected");
};
<h3>Z Axis</h3>
ws.onclose = () => {
console.warn("WS disconnected → reconnecting...");
setTimeout(connectWS, 1000);
};
<button onclick="jog('z',-10)">-10</button>
<button onclick="jog('z',-1)">-1</button>
ws.onmessage = (ev) => {
const text = ev.data;
<span id="z">0</span>
// GRBL/FluidNC status line?
if (text.startsWith("<")) {
handleStatus(text);
return;
}
<button onclick="jog('z',1)">+1</button>
<button onclick="jog('z',10)">+10</button>
// Try JSON only if valid JSON
try {
const data = JSON.parse(text);
console.log("JSON:", data);
} catch (e) {
// non JSON → ignore
}
};
</div>
ws.onerror = (e) => console.error("WS error:", e);
}
<h3>GCode</h3>
connectWS();
<input id="gcode" style="width:300px"/>
<button onclick="sendGcode()">Send</button>
// --- Jog-Funktion ---
function jog(axis, value) {
ws.send(JSON.stringify({
type: "jog",
axis: axis,
value: value
}));
}
<br><br>
// --- GRBL Status Parser ---
function handleStatus(line) {
<button onclick="setZero()">Set Current Position to Zero</button>
let match = line.match(/WPos:([^|>]+)/);
if (!match) {
match = line.match(/MPos:([^|>]+)/);
if (!match) return; // Keiner von beiden vorhanden
}
<script>
const ws = new WebSocket("wss://"+location.host);
const coords = match[1].split(",").map(Number);
ws.onmessage = (e)=>{
// Nur X (Index 0) und Z (Index 2) anzeigen
const x = coords[0];
const z = coords[2];
const data = JSON.parse(e.data);
if(data.type==="connection"){
if(data.connected){
document.getElementById("connection").innerText="FluidNC connected";
}else{
document.getElementById("connection").innerText="Trying to connect to FluidNC...";
}
}
if(data.type==="status"){
document.getElementById("x").innerText=data.x.toFixed(2);
document.getElementById("z").innerText=data.z.toFixed(2);
}
};
function jog(axis,val){
ws.send(JSON.stringify({
type:"jog",
axis:axis,
value:val
}));
}
function sendGcode(){
ws.send(JSON.stringify({
type:"gcode",
cmd:document.getElementById("gcode").value
}));
}
function setZero(){
ws.send(JSON.stringify({
type:"zero"
}));
}
</script>
document.getElementById("posX").textContent = x.toFixed(3);
document.getElementById("posZ").textContent = z.toFixed(3);
}
</script>
</body>
</html>