1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
const express = require('express');
const http = require('http');
const socketIo = require('socket.io');
const five = require('johnny-five');

const app = express();
const server = http.createServer(app);
const io = socketIo(server);

// 提供静态文件
app.use(express.static('public'));

// Arduino连接
let board = new five.Board({
  port: '/dev/ttyACM0', // 根据实际情况修改
  repl: false
});

let led = null;
let servo = null;

board.on('ready', () => {
  console.log('Arduino连接成功!');
  
  // 初始化组件
  led = new five.Led(13);
  servo = new five.Servo(9);
  
  // 监听WebSocket连接
  io.on('connection', (socket) => {
    console.log('客户端连接');
    
    // 处理LED控制
    socket.on('led-control', (data) => {
      if (data.state === 'on') {
        led.on();
      } else if (data.state === 'off') {
        led.off();
      } else if (data.state === 'blink') {
        led.blink(500);
      }
      io.emit('led-status', {state: data.state});
    });
    
    // 处理舵机控制
    socket.on('servo-control', (data) => {
      servo.to(data.angle);
      io.emit('servo-status', {angle: data.angle});
    });
    
    // 断开连接
    socket.on('disconnect', () => {
      console.log('客户端断开连接');
    });
  });
});

board.on('error', (err) => {
  console.log('Arduino连接错误:', err);
});

const PORT = process.env.PORT || 3000;
server.listen(PORT, () => {
  console.log(`服务器运行在 http://localhost:${PORT}`);
});

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
// 建立Socket连接
const socket = io();

// 连接状态指示
const connectionStatus = document.getElementById('connection-status');

// 更新连接状态
socket.on('connect', () => {
    console.log('已连接到服务器');
    connectionStatus.textContent = '连接状态: 已连接';
    connectionStatus.classList.add('connected');
    connectionStatus.classList.remove('disconnected');
});

socket.on('disconnect', () => {
    console.log('与服务器断开连接');
    connectionStatus.textContent = '连接状态: 断开连接';
    connectionStatus.classList.remove('connected');
    connectionStatus.classList.add('disconnected');
});

// LED控制
const ledOnBtn = document.getElementById('led-on');
const ledOffBtn = document.getElementById('led-off');
const ledBlinkBtn = document.getElementById('led-blink');
const ledStatus = document.getElementById('led-status');

ledOnBtn.addEventListener('click', () => {
    socket.emit('led-control', {state: 'on'});
});

ledOffBtn.addEventListener('click', () => {
    socket.emit('led-control', {state: 'off'});
});

ledBlinkBtn.addEventListener('click', () => {
    socket.emit('led-control', {state: 'blink'});
});

// 更新LED状态
socket.on('led-status', (data) => {
    ledStatus.textContent = data.state === 'on' ? '开启' : 
                           data.state === 'off' ? '关闭' : '闪烁';
});

// 舵机控制
const servoSlider = document.getElementById('servo-slider');
const servoValue = document.getElementById('servo-value');
const servoStatus = document.getElementById('servo-status');

servoSlider.addEventListener('input', () => {
    const angle = servoSlider.value;
    servoValue.textContent = `${angle}°`;
    socket.emit('servo-control', {angle: parseInt(angle)});
});

// 更新舵机状态
socket.on('servo-status', (data) => {
    servoStatus.textContent = `${data.angle}°`;
    servoSlider.value = data.angle;
    servoValue.textContent = `${data.angle}°`;
});

// 初始化页面
document.addEventListener('DOMContentLoaded', () => {
    console.log('控制面板已加载');
});